• Buenos dias,

    El problema me surge a la hora de colocar los 3 sliders situados debajo del principal en mi sitio evasion.hol.es/. He insertado una tabla y dentro de ella los 3 sliders, uno en cada celda, pero no consigo que el primero empiece a la altura de donde empieza el slider situado encima, y que el tercero terminara a la altura de donde termina el situado encima de el. es decir, que los 3 sliders ocupen el mismo ancho que el situado encima de ellos. El codigo empleado ha sido el siguiente:

    <table style=»border: 0pt solid #cccccc; width: 100%;» border=»0″ frame=»none» cellspacing=»0″ cellpadding=»0″ align=»center»>
    <tbody>
    <tr>
    <td style=»border:1px solid transparent «; style=»text-align: left;»>[wowslider id=»44″]</td>
    <td style=»border:1px solid transparent «; style=»text-align: left;»>[wowslider id=»45″]</td>
    <td style=»border:1px solid transparent «; style=»text-align: left;»>[wowslider id=»39″]</td>
    </tr>
    </tbody>
    </table>

    Gracias

Viendo 6 respuestas - de la 1 a la 6 (de un total de 6)
  • Saludos trunkhs.

    Para mostrar los sliders uno debajo de otro debe cerrar y abrir tantos tr como td tengas:

    <table style="border: 0pt solid #cccccc; width: 100%;" border="0" frame="none" cellspacing="0" cellpadding="0" align="center">
    	<tbody>
    		<tr>
    			<td style="border:1px solid transparent "; style="text-align: left;">[wowslider id="44"]</td>
    		</tr>
    		<tr>
    			<td style="border:1px solid transparent "; style="text-align: left;">[wowslider id="45"]</td>
    		</tr>
    		<tr>
    			<td style="border:1px solid transparent "; style="text-align: left;">[wowslider id="39"]</td>
    		</tr>
         </tbody>
    </table>

    Podrías usar divs en sustitución de tablas:

    <div class="my-slider">[wowslider id="44"]</div>
    <div class="my-slider">[wowslider id="45"]</div>
    <div class="my-slider">[wowslider id="39"]</div>

    y de ser necesario darles estilo con la clase my-slider

    Iniciador del debate trunkhs

    (@trunkhs)

    No quiero uno debajo de otro, quiero que los tres esten en linea, pero que ocupen el mismo ancho que el slider que esta encima de ellos y no lo consigo.

    Muchas gracias por tu ayuda

    Prueba colocando esto al final de tu hoja de estilo:

    .home .entry-content table tbody tr td {
         margin: none !important;
         right: 4%;
    }
    
    .home .entry-content table tbody tr td + td {
         margin: 0 auto !important;
    }
    
    .home .entry-content table tbody tr td + td + td {
         margin: none !important;
         left: 28%;
    }

    ¿Ahora si he acertado? xD

    Iniciador del debate trunkhs

    (@trunkhs)

    Pues no se me ha resuelto, seguramente habrá que intervenir en el codigo de la tabla directamente, con algo como margin: 0 pero no se. Y tal vez el codigo no sea del todo correcto, deberia especificar 1050px o cambiar el tamaño de las celdas, o su alineacion…

    Gracias

    Cambia:

    .home .entry-content table tbody tr td {
    .home .entry-content table tbody tr td + td {
    .home .entry-content table tbody tr td + td + td {

    Por

    #wowslider-container44 {
    #wowslider-container45 {
    #wowslider-container39 {

    En ese orden justo. El código anterior correspondía a los elementos html sin tomar en cuenta las ids de los mismos, cosa de que si necesitabas cambiar algún slider no tendrías que adaptar el css a la nueva id pero veo que no funciona.

    Iniciador del debate trunkhs

    (@trunkhs)

    El slider derecho se ha ajustado aunque no del todo bien, los otros se han quedado igual.

    😉

Viendo 6 respuestas - de la 1 a la 6 (de un total de 6)
  • El debate ‘Los sliders ocupen el ancho de 1050px asignado al que tienen encima’ está cerrado a nuevas respuestas.