Tengo una página que me mandaron (cuyo código yo no diseñé) y el header de la página se encuentra desfasado. Literalmente lo partí en dos para que en la parte de la izquierda donde está el logo fuera una imagen con un link y en la parte derecha pudiera poner los íconos de las redes sociales.
En Firefox, Chrome etc... se ve bien. Pero en el explorer se cae la parte de la derecha. La parte de la izquierda tiene declarado float:left, pero si a la parte de la derecha le pongo float:right esta desaparece.
esta es la imagen:
Este es el código HTML
Código:
<div id="ocuclinika"><a href="#" target="_self"><img src="images/layout/ocuclinika.jpg" border="0"></a></div>
<div id="contsocial">
<div class="social">
<div class="iconotwitter"><a href="http://twitter.com/#!/ocuclinika"><img src="images/twitter.gif" width="29" height="29" border="0"></a></div>
<div class="iconofacebook"><a href="http://www.facebook.com/pages/Ocuclinika/205078222860717 "><img src="images/facebook.gif" width="30" height="30" border="0"></a></div>
<div class="iconoblogger"><a href="http://ocuclinika.blogspot.com"><img src="images/blogger.gif" width="30" height="30" border="0"></a></div>
</div>
</div>
Y este es su respectivo CSS
Código:
#ocuclinika {display:block; position:relative; height:132px; width:273px; float:left; overflow:hidden;}
#contsocial {display:block; position:relative; background:url(../images/layout/ocu2.jpg); height:132px; width:508px; overflow:hidden; float:inherit;}
.social {display:block; position:relative; width:100px; float:right;}