Tema: problema ie9 css - bordes
Ver Mensaje Individual
  #1 (permalink)  
Antiguo 04/07/2012, 23:30
Derzz
 
Fecha de Ingreso: enero-2011
Mensajes: 112
Antigüedad: 13 años, 9 meses
Puntos: 4
problema ie9 css - bordes
Hola q a todos..
me siento en la necesidad de crear una plantilla para worpress pero tengo un inconveniente con ie9 y los "border-radius"
no aparecen redondeados, ya los probe en chrome, firefox, safari, opera

Código HTML: 
Ver original
  1. <!DOCTYPE html>
  2.  
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4.  
  5. <head>
  6.  
  7. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  8.  
  9. <meta charset="UTF-8" />
  10.  
  11. <title>
  12.  
  13. derzz | Otro sitio realizado con WordPress</title>
  14.  
  15. <link rel="profile" href="http://gmpg.org/xfn/11" />
  16.  
  17. <link rel="stylesheet" type="text/css" media="all" href="http://localhost/wp-content/themes/Derzz/style.css" />
  18.  
  19. <link rel="pingback" href="http://localhost/xmlrpc.php" />
  20.  
  21. </head>
  22.  
  23.  
  24.  
  25. <body class="home blog logged-in admin-bar">
  26.  
  27.  
  28.  
  29. <div id="wrapper"><!--tanbein en footer.php-->
  30.  
  31.  
  32.  
  33. <div class="header" id="header">
  34.  
  35.   <div class="imgn" id="imgn">
  36.  
  37. <img src="http://localhost/wp-content/themes/Derzz/imagenes/headers/banner.jpg" height="353" width="977" alt="" />
  38.  
  39.   </div>
  40.  
  41.   <div class="bar_nav" id="bar_nav">
  42.  
  43.   <center>
  44.  
  45.   <div class="menu"><ul><li class="current_page_item"><a href="http://localhost/" title="Inicio">Inicio</a></li><li class="page_item page-item-2"><a href="http://localhost/?page_id=2">Página de ejemplo</a></li></ul></div>
  46.   </center>
  47.  
  48.   </div>
  49.  
  50. </div><!--header-->
  51.  
  52.  
  53.  
  54. <div class="separador_head" id="separador_head"></div><!--seprador_head-->
  55.  
  56.     <div id="contenedor_loop" class="contenedor_loop">
  57.  
  58. <div class="layer" id="layer">
  59.   <div class="titulo" id="titulo"> <h1 class="titulos"><a href="http://localhost/?p=1">¡Hola mundo!</a></h1></div>
  60.   <div class="tag" id="tag">
  61.     <h1 class="fechas">julio 5 2012</h1><h1 class="autor">Escrito por: derzz</h1>
  62.   </div>
  63.   <div class="post" id="post"><h1 class="contenido"><p>Bienvenido a WordPress. Esta es tu primera entrada. Edítala o bórrala, ¡y comienza a publicar!.</p>
  64. </h1></div>
  65.   <div class="editar" id="editar"><a class="post-edit-link" href="http://localhost/wp-admin/post.php?post=1&amp;action=edit" title="Editar entrada">Editar</a> </div>
  66. </div>
  67.  
  68.  
  69.     </div><!--contenedor_loop-->
  70. <div class="sidebar" id="sidebar">
  71.  <div class="widgetclass" id="widgetid"><div id="search-2" class="widget_search"><form role="search" method="get" id="searchform" action="http://localhost/" >
  72.     <div><label class="screen-reader-text" for="s">Buscar por:</label>
  73.     <input type="text" value="" name="s" id="s" />
  74.     <input type="submit" id="searchsubmit" value="Buscar" />
  75.     </div>
  76.     </form></div>       <div id="recent-posts-2" class="widget_recent_entries">     <h3 class="twidgets">Entradas recientes</h3>        <ul>
  77.                 <li><a href="http://localhost/?p=1" title="¡Hola mundo!">¡Hola mundo!</a></li>
  78.                 </ul>
  79.         </div><div id="recent-comments-2" class="widget_recent_comments"><h3 class="twidgets">Comentarios recientes</h3><ul id="recentcomments"><li class="recentcomments"><a href='http://wordpress.org/' rel='external nofollow' class='url'>Sr WordPress</a> en <a href="http://localhost/?p=1#comment-1">¡Hola mundo!</a></li></ul></div><div id="archives-2" class="widget_archive"><h3 class="twidgets">Archivos</h3>     <ul>
  80.             <li><a href='http://localhost/?m=201207' title='julio 2012'>julio 2012</a></li>
  81.         </ul>
  82. </div><div id="categories-2" class="widget_categories"><h3 class="twidgets">Categorías</h3>     <ul>
  83.     <li class="cat-item cat-item-1"><a href="http://localhost/?cat=1" title="Ver todas las entradas archivadas en Sin categoría">Sin categoría</a>
  84. </li>
  85.         </ul>
  86. </div><div id="meta-2" class="widget_meta"><h3 class="twidgets">Meta</h3>           <ul>
  87.             <li><a href="http://localhost/wp-admin/">Administrador del sitio</a></li>           <li><a href="http://localhost/wp-login.php?action=logout&_wpnonce=673cd60a31">Desconectar</a></li>
  88.             <li><a href="http://localhost/?feed=rss2" title="Suscribirse a este sitio usando RSS 2.0"><abbr title="Really Simple Syndication">RSS</abbr> de las entradas</a></li>
  89.             <li><a href="http://localhost/?feed=comments-rss2" title="Últimos comentarios a todas las entradas en RSS"><abbr title="Really Simple Syndication">RSS</abbr> de los comentarios</a></li>
  90.             <li><a href="http://es.wordpress.org/" title="Gestionado con WordPress, una avanzada plataforma semántica de publicación personal.">WordPress.org</a></li>
  91.                         </ul>
  92. </div> </div>
  93. </div><!--muestra widtgets-->   
  94. <div class="footer" id="footer">
  95. <h1 class="autor">Gracias por tu Visita. Creado por Derzz</h1></div>
  96. </div><!--wrapper-->
  97.  
  98. </body>
  99. </html>

css:
Código CSS: 
Ver original
  1. body{
  2.         margin:0 auto;
  3.         background:#1d1d1d;
  4.         color:#FFF;
  5. }
  6. .contenedor_loop a, ul li{
  7.         color:#0099CC;
  8.         list-style:none;
  9.         list-style-image:none;
  10.         padding-left:0px;
  11.         text-decoration:none;
  12. }
  13. a{
  14.         
  15.         }
  16. a:hover{
  17.         color:#0099FF;
  18.         list-style:none;
  19. }
  20. a:visited{
  21.         color:#006699;
  22.         list-style:none;
  23.         text-decoration:none;
  24. }
  25.  
  26. /*texto*/
  27. h1.titulos{
  28.         font-weight:bold;
  29.         font-size:26px;
  30. }
  31. h1.fechas{
  32.         font-size:12px;
  33.         font-weight:bold;
  34.         color:#999;
  35.         font-style:oblique;
  36. }
  37. h1.contenido{
  38.         font-size:14px;
  39.         font-weight:bold;
  40.         color:#FFF;
  41. }
  42. h1.autor{
  43.         font-size:14px;
  44.         font-weight:bold;
  45.         color:#999;
  46. }
  47. h3.twidgets{
  48.         font-size:18px;
  49.         color:#333;
  50. }
  51. h3{}
  52. h2{}
  53. h1{}
  54. /*header.php*/
  55.         /*barra navegacion*/
  56. #bar_nav{
  57.         padding:0;
  58.         margin:0;
  59.         background-color:#1f1f1f;
  60.         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#3b3b3b, endColorstr=#1f1f1f);  
  61.         background: -o-linear-gradient(top, #3b3b3b , #1f1f1f);
  62.         background: -moz-linear-gradient(top, #3b3b3b , #1f1f1f);
  63.         background: -webkit-gradient(linear, 0 0, 0 100%, from(#3b3b3b),  to(#1f1f1f));
  64. } 
  65. .menu{
  66.         margin:auto;
  67.         width:900px;
  68. }
  69. .menu ul{
  70.         padding:0;
  71.         margin:0 auto;
  72.         overflow:hidden;
  73.         display:block;
  74. }
  75. .menu ul li{
  76.         float:left;
  77.         margin:0;
  78. }
  79. .menu ul li a{
  80.         display:block;
  81.         padding:10px 25px;
  82.         outline:0;
  83.         color:#FFF;
  84.         text-decoration:none;
  85. }
  86. .menu ul li a:hover{
  87.         color:#969696;
  88.         text-decoration::none;
  89.         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#1f1f1f, endColorstr=#3b3b3b);
  90.         background: -o-linear-gradient(top, #1f1f1f , #3b3b3b);
  91.         background: -moz-linear-gradient(top, #1f1f1f , #3b3b3b);
  92.         background: -webkit-gradient(linear, 0 0, 0 100%, from(#1f1f1f),  to(#3b3b3b));
  93. }
  94. .menu ul li ul{
  95.         display:none;
  96.         position:absolute;
  97.         background:#3b3b3b;
  98.         padding:0;
  99.         width:242px;
  100. }
  101. .menu ul li:hover ul{
  102.         display:block;
  103.         margin-top:0;
  104.         text-align:left;
  105. }
  106. .menu ul li ul li{
  107.         display:block;
  108.         position:relative;
  109.         float:none;
  110. }
  111. .menu ul li ul li a:hover{
  112.         color:#295474;
  113. }
  114.         /*pagina*/
  115. #wrapper{
  116.         width:977px;
  117.         margin:auto;
  118.         background:#0f0f0f;
  119.         overflow:hidden;
  120. }
  121.  
  122. .header{
  123.         width:977px;
  124.         height:auto;
  125. }
  126. .imgn{
  127.         
  128.         width:100%;
  129. }
  130. .bar_nav{
  131.         
  132. }
  133. .separador_head{
  134.         width:100%;
  135.         height:30px;
  136. }
  137. /*Loop.php*/
  138. .contenedor_loop{
  139.     width:65%;
  140.     float:left;
  141.     margin:0 auto 0 auto;
  142.     padding-left:65px;
  143. }
  144. .layer{
  145.         color:#006699;
  146.         width:570px;
  147.         border-bottom-color:#666666;
  148.         border-bottom-style:solid;
  149.         border-bottom-width:1px;
  150. }
  151. .titulo{
  152.         padding:0px;
  153. }
  154. .tag{
  155. }
  156. .post{
  157.         width:100%;
  158.         color:#000000;
  159. }
  160. .editar{
  161.         height:30px;
  162.         color:#FF0000;
  163. }
  164. /*sidebar.php*/
  165. .sidebar{
  166.         width:200px;
  167.         margin:0;
  168.         margin-right:50px;
  169.         padding:0;
  170.         float:right;
  171. }
  172. .widgetclass div{
  173.         }
  174. .widgetclass h3 {
  175.         background: -webkit-gradient(linear, 0 0,0 100%,from(#3b3b3b), to(#1f1f1f));
  176.         background: -moz-linear-gradient(top, #3b3b3b, #1f1f1f);
  177.         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#3b3b3b, endColorstr=#1f1f1f);
  178.         border-radius:5px;
  179.         -moz-border-radius:5px;
  180.         margin:0;
  181.         color:#666666;
  182.         text-align:center;
  183.         }
  184. .widgetclass ul{
  185.         margin:0;
  186.         padding:8px 8px;
  187.         margin-top:5px;
  188.         margin-bottom:25px;
  189.         background: -webkit-gradient(linear,0 0, 0 100%, from(#3b3b3b), to(#1f1f1f));
  190.         background: -moz-linear-gradient(top, #3b3b3b, #1f1f1f);
  191.         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#3b3b3b, endColorstr=#1f1f1f);
  192.         border-radius:5px;
  193.         -moz-border-radius:5px;
  194. }
  195. .widgetclass ul li a{
  196.         text-decoration:none;
  197.         font-family:Arial, Helvetica, sans-serif;
  198.         font-style:italic;
  199.         font-size:14px;
  200.         color:#0099ff;
  201.         outline:none;
  202. }
  203.  
  204. /*foooter.php*/
  205. .footer{
  206.     
  207.         border-radius:8px;
  208.         -moz-border-radius:8px;
  209.         -webkit-border-radius:8px;
  210.         width:90%;
  211.         float:left;
  212.         background: -webkit-gradient(linear, 0 0, 0 100%,from(#255da8), to(#1f1f1f));
  213.         background: -moz-linear-gradient(top, #255da8, #1f1f1f);
  214.         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#255da8, endColorstr=#1f1f1f);
  215.         margin:0 5%;
  216.         margin-bottom:10px;
  217.         text-align:center;
  218. }
  219. .widget_search{
  220.         margin-bottom:25px;
  221.         }
  222. input#s{
  223.         background:#666 url(imagenes/search.png) left no-repeat ;
  224.         padding:7px 10px 7px 20px;
  225.         width:80%;
  226.         color:#1f1f1f;
  227.         border-radius:8px;
  228.         -moz-border-radius:8px;
  229.         -webkit-border-radius:8px;
  230.         border-style:solid;
  231.         border-color:#09C;
  232.         outline:none;
  233.         
  234. }
  235. input#searchsubmit{
  236.         margin:5px;
  237.         border-width:2px;
  238.         border-radius:8px;
  239.         -moz-border-radius:8px;
  240.         -webkit-border-radius:8px;
  241.         border-color:#000;
  242.         border-style:solid;
  243.         padding:5px 15px;
  244.         background: -webkit-gradient(linear, 0 0, 0 100%,from(#255da8), to(#1f1f1f));
  245.         background: -moz-linear-gradient(top, #255da8, #1f1f1f);
  246.         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#255da8, endColorstr=#1f1f1f);
  247.         }