Problema con css3pie

kriss8725 · #1 (**permalink**) 12/02/2012, 15:28

Buenas tardes es la primera vez que estoy utilizando la herramienta css3pie, pero tengo un problema el border-radius se lo estoy aplicando a un textbox, pero cuando ejecuto el script en IE7 e IE8 mi caja de texto desaparece, este es mi código:

Código HTML:

<?php	
  include_once("class/global.php");
  $_G_ = new _GLOBAL_();
?>
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8"/>
<link rel="shortcut icon" href="<?php echo $_G_->baseURL;?>imgs/favicon.ico" type="image/x-icon" />
<link type="text/css" rel="stylesheet" href="<?php echo $_G_->baseURL;?>css/page.css" media="all" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="<?php echo $_G_->baseURL;?>js/modernizr.custom.js"></script>
<title>Maderas y Materiales San José</title>
</head>

<body>
 <div id="wrap"><!--Inicia wrap-->
   <header id="header"><!--Inicia header-->
     <div id="logo" class="secccionesHeader"><!--Inicia logo-->
       <a href="<?php echo $_G_->baseURL;?>">
         <img id="imgLogo" src="<?php echo $_G_->baseURL;?>imgs/logo.png" width="187" height="180" alt="Maderas y Materiales San José" />
       </a>
     </div><!--Fin logo-->
     
     <div id="menu" class="secccionesHeader"><!--Inicia menu-->
       
       <div id="buscadorProveedor"><!--Inicia buscadorProveedor-->
         
         <div id="logoProveedor"><!--Inicia logoProveedor-->
           <img id="imgProveedor" src="<?php echo $_G_->baseURL;?>imgs/cruz_azul.jpg" width="195" height="75" alt="Cemento Cruz Azul" />
         </div><!--Fin logoProveedor-->
         
         <div id="buscador"><!--Inicia buscador-->
           <form action="" method="post">
             <input name="buscar" id="buscar" type="text" size="32" value="Buscar productos..." />
             <input id="btnBuscar" name="btnBuscar" type="submit" value="" />
           </form>
         </div><!--Fin buscador-->
         
       </div><!--Fin buscadorProveedor-->
       
       <nav id="navegacion" class="navegacion"><!--Inicio navegacion-->
         
       </nav><!--Fin navegacion-->
       
     </div><!--Fin menu-->
     
   </header><!--Fin header-->
 </div><!--Fin wrap-->
</body>
</html>

Código:

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,center,u,b,i{margin: 0; padding: 0; border: 0; outline: 0; font-weight: normal; font-style: normal;font-size: 100%; font-family: inherit; vertical-align: baseline}
*:focus{outline:0}
body{line-height:1;background-image:url(../imgs/bg_black.jpg);font-family:"Times New Roman", Times, serif; font-size:16px}
blockquote:before,blockquote:after,q:before,q:after{content: ""}
blockquote,q{quotes: "" ""}
input,textarea{border:0;margin:0; padding-bottom:6px;padding-left:10px;padding-right:10px;padding-top:6px;}
ol,ul{list-style: none}
table{border-collapse: collapse;border-spacing: 0}
hr{margin: 0; padding: 0; border: 0; color: #000; background-color: #000; height: 1px}

/*Identificadores*/
#btnBuscar{
	       background:none;
	       background-image:url(../imgs/lupa.png);
		   background-position:right;
		   background-repeat:no-repeat;
		   border:0;
		   border-radius:12px;
		   cursor:pointer;
		   margin-left:-34px;
		   width:24px;
	      }
#buscador{
		  float:right;
		  margin-right:40px;
		  margin-top:20px;
		  width:240px
	     }
#buscar{
	    border-radius:12px;
		-moz-border-radius:12px;
		-webkit-border-radius:12px;
		behavior:url(../PIE/PIE.htc)
	   }
#imgLogo{
	     margin-top:10px;
	    }
#logo{
	  float:left;
	  height:200px;
	  text-align:center;
	  width:280px;
	 }
#logoProveedor{
			   float:left;
			   margin-left:37px;
			   margin-top:20px;
			   width:300px;
	          }
#lupa{
	 }
#menu{
	  float:left;
	  height:200px;
	  width:760px;
	 }
#wrap{
	  margin:0 auto;
	  height:100%;
	  width:1040px;
	 }

/*Clases*/
.letrasBlancas{
	           color:#FFF
	          }
.secccionesHeader{
	              background-image:url(../imgs/bg_header.png);
	             }

referenteweb · #2 (**permalink**) 12/02/2012, 16:23

Prueba con agregarle a #buscar position: relative y z-index: 9999; si eso no te funciona debes indicar una position: relative a su contenedor.

Saludos

kriss8725 · #3 (**permalink**) 13/02/2012, 13:03

El problema que he encontrado es que si al div que contiene el input le pongo un backgroud-image, el input se pone por debajo de la imagen y no se ve, y si me redondea bien en IE7 e IE8 pero no puedo ponerle ese background-image. Alguien sabe cual es la solucion??