Tema: Problema con el centrado del css en IE
Ver Mensaje Individual
  #4 (permalink)  
Antiguo 24/10/2009, 18:29
Avatar de willyfc
willyfc
 
Fecha de Ingreso: octubre-2008
Ubicación: Santa Cruz - Bolivia
Mensajes: 662
Antigüedad: 15 años, 6 meses
Puntos: 40
Respuesta: Problema con el centrado del css en IE
Bueno he hecho algunos cambios pero solo a la parte de arriba, no se si afectara a tu menu desplegable, espero te sirva:

Código html: 
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  5. <title>ejemplo</title>
  6. <style type="text/css">
  7. *{margin:0 ; padding:0; border:0;}
  8. body {
  9.     font: 10px normal Arial, Helvetica, sans-serif;
  10.     background: #ddd url(fondo.jpg) repeat-x;
  11.  
  12. }
  13. .container {
  14.     width: 960px;
  15.     margin: 0 auto;
  16.     position: relative;
  17. }
  18. #header {background: url(universo.jpg) no-repeat  center top; height:120px;}
  19. .disclaimer {
  20.     color: #999;
  21.     padding: 100px 0 7px 0;
  22.     text-align: right;
  23.     display: block;
  24.     position: absolute;
  25.     top: 0; right: 0;
  26. }
  27. #header .disclaimer a { color: #ccc;}
  28. ul.topnav {
  29.     list-style: none;
  30.     padding: 0 20px;    
  31.     margin:120px 0 0 0;
  32.     float: left;
  33.     width: 920px;
  34.     background: #222;
  35.     font-size: 1.2em;
  36.     background:#CCC url(topnav_bg.gif) repeat-x;
  37. }
  38. ul.topnav li {
  39.     float: left;
  40.     margin: 0;  
  41.     padding: 0 15px 0 0;
  42.     position: relative; /*--Declare X and Y axis base--*/
  43. }
  44. ul.topnav li a{
  45.     padding: 10px 5px;
  46.     color: #fff;
  47.     display: block;
  48.     text-decoration: none;
  49.     float: left;
  50. }
  51. ul.topnav li a:hover{
  52.     background: url(topnav_hover.gif) no-repeat center top;
  53. }
  54. ul.topnav li span { /*--Drop down trigger styles--*/
  55.     width: 17px;
  56.     height: 35px;
  57.     float: left;
  58.     background: url(flecha.jpg) no-repeat center top;
  59. }
  60. ul.topnav li span.subhover {background-position: center bottom; cursor: pointer;} /*--Hover effect for trigger--*/
  61. ul.topnav li ul.subnav {
  62.     list-style: none;
  63.     position: absolute; /*--Important - Keeps subnav from affecting main navigation flow--*/
  64.     left: 0; top: 35px;
  65.     background: #333;
  66.     margin: 0; padding: 0;
  67.     display: none;
  68.     float: left;
  69.     width: 170px;
  70.     -moz-border-radius-bottomleft: 5px;
  71.     -moz-border-radius-bottomright: 5px;
  72.     -webkit-border-bottom-left-radius: 5px;
  73.     -webkit-border-bottom-right-radius: 5px;
  74.     border: 1px solid #111;
  75. }
  76. ul.topnav li ul.subnav li{
  77.     margin: 0; padding: 0;
  78.     border-top: 1px solid #DF0101; /*--Create bevel effect--*/
  79.     border-bottom: 1px solid #444; /*--Create bevel effect--*/
  80.     clear: both;
  81.     width: 170px;
  82. }
  83. html ul.topnav li ul.subnav li a {
  84.     float: left;
  85.     width: 145px;
  86.     background: #333 url(dropdown_linkbg.gif) no-repeat 10px center;
  87.     padding-left: 20px;
  88. }
  89. html ul.topnav li ul.subnav li a:hover { /*--Hover effect for subnav links--*/
  90.     background: #222 url(dropdown_linkbg.gif) no-repeat 10px center; 
  91. }
  92. #header img {
  93.     margin: 20px 0 10px;
  94. }
  95. </style>
  96. </head>
  97.  
  98. <body>
  99. <div class="container"> 
  100.     <div class="disclaimer">Lo más visto en en la última semana <a href="http://www.SohTanaka.com">LO MEJOR!</a>.</div> 
  101.     <div id="header"> 
  102.         <ul class="topnav"> 
  103.             <li><a href="inicio.html">Home</a></li> 
  104.             <li> 
  105.                 <a href="entretenimiento.html">Entretenimiento</a> 
  106.                 <ul class="subnav"> 
  107.                     <li><a href="#">Sub Nav Link</a></li> 
  108.                     <li><a href="#">Sub Nav Link</a></li> 
  109.                     <li><a href="#">Sub Nav Link</a></li> 
  110.                     <li><a href="#">Sub Nav Link</a></li> 
  111.                     <li><a href="#">Sub Nav Link</a></li> 
  112.                 </ul> 
  113.             </li> 
  114.             <li> 
  115.                 <a href="#">Resources</a> 
  116.                 <ul class="subnav"> 
  117.                     <li><a href="#">Sub Nav Link</a></li> 
  118.                     <li><a href="#">Sub Nav Link</a></li> 
  119.                     <li><a href="#">Sub Nav Link</a></li> 
  120.                     <li><a href="#">Sub Nav Link</a></li> 
  121.                     <li><a href="#">Sub Nav Link</a></li> 
  122.                     <li><a href="#">Sub Nav Link</a></li> 
  123.                 </ul> 
  124.             </li> 
  125.             <li><a href="#">About Us</a></li> 
  126.             <li><a href="#">Advertise</a></li> 
  127.             <li><a href="#">Submit</a></li> 
  128.             <li><a href="#">Contact Us</a></li> 
  129.         </ul> 
  130.     </div>
  131.      <div style="clear:both"></div>
  132. </div> 
  133. </body>
  134. </html>
__________________
WFC
codigo82