Cantos arredondados no IE não funcionam
Pessoal, nao sei exatamente se fiz de forma correta, mas acho q sim. Por favor me ajudem. estou fazendo um formularrio para busca para um site q estou desenvolvendo com uso de CSS. ainda estou aprendendo e por isso to batendo a cabeça pra tentar acertar.
Bom, Fiz 3 img para compor os cantos arredondados da div q contem o form e para o campo de texto do mesmo. no Firefox ta beleza, já no internet explorer ta dando pau. as imagens q utilizei pra arredondar os lados do campo do form estao um pouquinho pra cima. ja tentei modificar o padding mas deu um problema ainda maior, entao usei margin-top com 15 px de distancia. So q se eu usar uma distancia de 14 px ele passa a funcionar no IE e o Firefox é q passa a dar "bug".
Nao sei se deram pra entender direito. de qualquer forma segue o link:
http://br.geocities.com/designer.marcio/
Segue o codigo:
<html>
<head>
<title>testando cantos</title>
<style type="text/css" media="all">
.formbusca{ width:186px;
height:45px;
padding:0;
margin:0;
}
.esq { width:11px;
height: 45px;
background-image:url(esq_form.gif);
background-repeat:no-repeat;
float:left;
}
.meio { width:112px;
height:45px;
margin:0;
padding:0;
background-color:#CCCC99;
float:left;
}
.interdir {width:42px;
height:45px;
margin:0;
padding:0;
background-color:#CCCC99;
background-image:url(dir-campoform.gif);
background-repeat:no-repeat;
float:left;
}
.campobusca {width:112px;
height:17px;
margin-top:14px;
border:0;
}
#formeio {height:17px;
margin:0;
padding:0;
}
.contbusca {height:17px;
margin:0;
padding:0;
}
.dir { width:11px;
height:45px;
background-image:url(dir_form.gif);
background-repeat:no-repeat;
float:left;
}
</style>
</head>
<body>
<div class="formbusca">
<div class="esq"></div>
<div class="meio">
<div id="formeio">
<form class="contbusca"><label>
<input type="text" class="campobusca">
</label>
</form>
</div>
</div>
<div class="interdir"></div>
<div class="dir"></div>
</div>
</body>
</html> Obrigado desde já pela atençao ae de tod@s,
Marcio Ricardo http://forum.imasters.com.br/public/style_emoticons/default/blush.gif
Discussão (4)
Carregando comentários...