Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Bom dia Pessoal.. eu to com um problemão.. já procurei, reprocurei.. achei algumas coisas, no firefox funcionou.. no IE8 também, mas no IE7 e o IE6 não funcionou..
O negócio é o seguinte:
eu preciso criar um banner que fique centralizado e as laterais aumentem e diminuam conforme a resolução do monitor.
Depois de pesquisar eu achei um script que funcionou, criei 3 divs e alterei elas com CSS. Funcionou perfeito nos navegadores que citei acima e não funcionou nos demais. Não sei o que fazer. Já usei o Z-index, e um monte de outras coisas. vou postar o código e o link para que vocês deem uma olhada.se olhar no firefox e no IE6 verão a diferença.
Arquivo HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title></title>
<link href="../css/estilo.css" type="text/css" rel="stylesheet" />
</head>
<body>
<div id="corpo">
<div id="banner_direita"></div>
<div id="banner_esquerda"></div>
<div id="banner_centro"></div>
</div>
</body>
</html>Arquivo CSS
* {
margin: 0px;
padding: 0px;
}body {
font-family: Verdana;
font-size: 12px;
color: #000000;
}
#corpo {
margin: auto;
margin-bottom: 5px;
width: 100%;
height: auto;
}#corpo #banner_centro {
margin: auto;
width: 900px;
height: 180px;
background-image: url("../img/banner_centro.jpg");
position: relative;
}#corpo #banner_esquerda {
float: left;
width: 49%;
height: 180px;
background-image: url("../img/banner_esquerda.jpg");
background-repeat: repeat-x;
}#corpo #banner_direita {
float: right;
width: 49%;
height: 180px;
background-image: url("../img/banner_direita.jpg");
background-repeat: repeat-x;
}E o Link Para que vocês possam ver funcionando.
Se alguém tiver uma solução.. agradeço..
Obrigado
Carregando comentários...