HTML - Unir dos Codigos html con css

 
Vista:

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
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;"/>&#160;<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
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder