Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Estou desenvolvendo um site para um consultório odontológico, e (pra variar) o IE não facilita a vida.
Pra centralizar os elementos do site, segui essa dica do Maujor: http://maujor.com/dicas/pg_centrada.php
MAS eu não botei a div correspondente ao fundo verde escuro dentro da div "tudo", porque assim ela não fica infinita pra direita (no FF).
No FF está perfeito, como deve ficar: http://img85.imageshack.us/img85/3746/firefoxt.jpg
Mas no IE tá assim: http://img6.imageshack.us/img6/7770/28523370.jpg
O que eu faço pra div "verde" ser exibida no IE como no FF??
<html>
<body>
<div id="verde"></div>
<div id="tudo">
<head><link rel="stylesheet" type="text/css" href="style.css" />
<title>Consultório Odontológico Dra. Gabriela R. Webster Dreher</title>
<div id="topo"><img src="imagens/topo.png" />
<div id="menu">
<ul>
<li><a href="#"><img src="imagens/menu/inicio.png" alt="inicio" border="0" /></a></li>
<li><a href="#"><img src="imagens/menu/formacao.png" alt="formação" border="0" /></a></li>
<li><a href="#"><img src="imagens/menu/tratamentos.png" alt="tratamentos" border="0" /></a></li>
<li><a href="#"><img src="imagens/menu/estrutura.png" alt="estrutura" border="0" /></a></li>
<li><a href="#"><img src="imagens/menu/localizacao.png" alt="localicação" border="0" /></a></li>
<li><a href="#"><img src="imagens/menu/contato.png" alt="contato" border="0" /></a></li>
</ul>
</div>
</div>
</head>
<div id="content"><img src="imagens/content.png" />
<div id="dicas"> <img src="imagens/dicas.png" alt="dicas de saude bucal" />
<div id="imagem-dicas"><img src="imagens/sorriso.jpg" /></div>
<div id="titulo-dicas"><a class="titulo">DICAS DE SAÚDE BUCAL</a></div>
<div id="texto-dicas"><a class="texto">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque auctor commodo commodo. Mauris aliquam vestibulum orci, quis aliquet odio ultricies ut. Aliquam non blandit erat. Aenean semper quam non velit pretium posuere. Curabitur ac adipiscing leo. Duis non libero odio, at fringilla lacus. Duis eget mauris lectus, non lacinia ligula. Aliquam convallis sodales sem ut porta. </a></div>
</div>
<div id="convenios">
<div id="titulo-convenios"><a class="titulo">CONVÊNIOS</a></div>
<div id="texto-convenios"><a class="texto">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque auctor commodo commodo. Mauris aliquam vestibulum orci, quis aliquet odio ultricies ut. Aliquam non blandit erat.<p></p>- Sindicato dos Sapateiros de Dois irmãos e Morro Reuter <br>- Sindicato dos Trabalhadores Rurais de Dois Irmãos</a></div>
</div>
<div id="barra-h"><img src="imagens/barra-h.png" /></div>
<div id="barra-v"><img src="imagens/barra-v.png" /></div>
</div>
<div id="rodape">
Dra. Gabriela R. Webster Dreher (2010) Todos os direitos reservados.<br>
Site desenvolvido por Melissa Webster<p></p></a>
</div>
</div>
</body>
</html>body {
background-color:#76b87a;
text-align:center;
margin:0px;
border:0px;
padding:0px;
bottom:50px;
}
.titulo {
font-family:Times;
font-size:20;
color:#212121;
}
.texto {
font-family:Times;
font-size:14;
text-align:justify;
color:#212121;
}
#verde {
background-color:002d22;
height:273px;
width:100%;
position:absolute;
border:none;
z-index:-1;
border:0px;
padding:0px;
}
#tudo {
width:695px;
margin:0 auto;
text-align:left;
}
#topo {
position:relative;
top:50px;
z-index:1;
height:223px;
width:695px;
}
#menu {
list-style:none;
position:absolute;
padding:0px;
border:0px;
bottom:0px;
width:800px;
height:17px;
top:182px;
left:-38px;
z-index:2;
}#menu ul li{
display:inline;
list-style:none;
padding:0px 3px 0px 3px;
}
#content {
position:absolute;
top:273px;
padding-bottom:60px;
}
#dicas {
position:absolute;
top:25px;
left:25px;
}
#titulo-dicas {
position:absolute;
top:25px;
left:25px;
}
#texto-dicas {
position:absolute;
top:60px;
left:25px;
width:330px;
text-align:justify;
}
#imagem-dicas {
position:absolute;
top:25px;
right:25px;
}
#convenios {
position:absolute;
top:300px;
left:0px;
height:300px;
width:500px;
}
#titulo-convenios {
position:absolute;
left:48px;
}
#texto-convenios {
position:absolute;
top:35px;
left:48px;
width:635px;
}
#barra-h {
position:absolute;
top:500px;
left:0px;
}
#barra-v {
position:absolute;
top:530px;
left:340px;
}
#rodape {
position:absolute;
top:1125px;
width:695px;
font-family:Times;
font-size:12;
text-align:center;
color:#212121;
}Obs: se alguém souber dizer o que está acontecendo com o menu no IE, fico muito agradecida!
Carregando comentários...