Unir dos Codigos html con css
Publicado por Juan Arias (1 intervención) el 10/05/2018 19:58:22
Hola soy nuevo y no he podido lograr unir estos dos códigos sin que se me dañe el formato, en resumen quiero una tabla de 2 x2 y en cada tabla una imagen con un código css que permita hacer un fade de dos imágenes, he logrado conseguir ambos códigos el de la tabla y el del fade pero cuando intento unirlos se me daña la distrubución de la tabla... como me pueden orientar?
ESTE ES EL CODIGO DE LA TABLA
ESTE ES EL CODIGO DEL CSS DEL FADE
La idea es poder hacer el efecto de fade pero en las imagenes que están dentro de la tabla alguien me puede orientar?
ESTE ES EL CODIGO DE LA TABLA
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<table class="ms-rteTable-0" cellspacing="0" style="width: 100%; height: 386px;">
<tbody>
<tr class="ms-rteTableEvenRow-0">
<td class="cf ms-rteTableEvenCol-0" style="width: 50%;">
<img class="ms-rteImage-2 ms-rtePosition-2 bottom" src="/ImgSopNegEsp/quienessomos1.png" alt="" style="margin: 5px; width: 260px; height: 165px;"/> <br/></td>
<td class="ms-rteTableOddCol-0" style="width: 50%;">
<img class="ms-rteImage-2" src="/ImgSopNegEsp/servicios1.png" alt="" style="margin: 5px; width: 260px; height: 165px;"/>
</td>
</tr>
<tr class="ms-rteTableOddRow-0">
<td class="ms-rteTableEvenCol-0">
<img class="ms-rtePosition-2 ms-rteImage-2" src="/ImgSopNegEsp/foros1.png" alt="" style="margin: 5px; width: 260px; height: 165px;"/>
</td>
<td class="ms-rteTableOddCol-0">
<img class="ms-rteImage-2" src="/ImgSopNegEsp/sabiasque1.png" alt="" style="margin: 5px; width: 260px; height: 165px;"/>
</td>
</tr>
</tbody>
</table>
ESTE ES EL CODIGO DEL CSS DEL FADE
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<style>
#cf {
position:relative;
height:281px;
width:450px;
margin:0 auto;
}
#cf img {
position:absolute;
left:0;
transition:opacity 1s ease-in-out;
}
#cf img.top:hover {
opa<span id='ms-rterangeselectionplaceholder-start'></span><span id='ms-rterangeselectionplaceholder-end'></span>city:0;
}
</style>
La idea es poder hacer el efecto de fade pero en las imagenes que están dentro de la tabla alguien me puede orientar?
Valora esta pregunta


0