Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Ola galera!
Estou criando um layout mas nao estou conseguindo fazer com que ele carregue corretamente no IE e no Firefox, está dando uma diferença no layout entre os 2 navegadores. Gostaria tbm que me ajudasse a corrigir alguns erros no layout.
page index.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">](http://www.w3.org/1999/xhtml)
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<link href="layout.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="tudo">
<div id="topo">
<h1> </h1>
</div>
<div id="barranav">
<ul>
<li><a href="#"><h5>Home</h5></a></li>
<li><a href="#"><h5>Empresa</h5></a></li>
<li><a href="#"><h5>Hardware</h5></a></li>
<li><a href="#"><h5>Web</h5></a></li>
<li><a href="#"><h5>Downloads</h5></a></li>
<li><a href="#"><h5>Contato</h5></a></li>
</ul>
</div>
<div id="nav">
<h4>COLUNA DE NAVEGACAO</h4>
<p>...</p>
</div>
<div id="destaque">destaque
</div>
<div id="apoio">
<h4>COLUNA DE APOIO</h4>
</div>
<div id="artigo">
<h4>artigo</h4>
</div>
<div id="palavra_bispo">
<h4>palavra do bispo</h4>
</div>
<div id="noticias">
<h4>noticias</h4>
</div>
<div id="videos">
<h4>videos</h4>
</div>
<div id="eventos">
<h4>eventos</h4>
</div>
<div id="rodape">
Copyright© OpenSystem Informática - Todos os Diretos Reservados </div>
</div>
</body>
</html>
page layout.css:
/ CSS Document /
* {
margin: 0;
padding: 0;
} margin:0;
padding:0;
border:none;
font: 11px/1.5 Verdana, Arial, Helvetica, sans-serif;
background:#ffe;
color:#333;
text-align:center;
}
body#duascolunas #nav {
display:none; / 'Some' com a coluna de navegacao /
}
body#duascolunas #principal {
width:615px; / Estende a coluna principal /
border-left-width:0;
padding-right:0;
}
#tudo {
width:750px;
margin:0 auto;
text-align:left;
}
#topo {
height: 153px;
width: 750px;
border-left: 1px solid #CCCCCC;
border-right:1px solid #CCCCCC;
border-top:1px solid #CCCCCC;
/*border: 1px solid #CCCCCC; */
margin-top:5px;
}
#barranav {
height:28px;
width:750px;
border-left: 1px solid #CCCCCC;
border-right:1px solid #CCCCCC;
font-family: Arial, Helvetica, sans-serif, Verdana;
font-size: x-small;
color: #000000;
text-decoration: none;
text-align: left;
float:left;
/* background:#CCCCCC url("layout_r3_c11.gif")
top left repeat-x fixed;#barranav ul {
list-style: none;
}
#barranav ul li {
float: left;
margin: 0 10px 0 10px;
}
#barranav h5 {
font:Verdana, Arial, Helvetica, sans-serif;
color: #000099;
text-decoration: none;
vertical-align: middle;
}
#nav {
width:168px;
height:595px;
float:left;
border:1px solid #CCCCCC;
}
#destaque {
float:left;
height:180px;
width:450px;
margin-top:3px;
margin-left:3px;
text-align:justify;
border:1px solid #CCCCCC;
border-width: 1 1px;
/*padding: 0 10px;*/
}
#apoio {
width:120px;
height:595px;
margin-left:3px;
float:right;
border:1px solid #CCCCCC; left: 800px;
top: 189px;
}
#artigo {
width:225px;
height:150px;
margin-top:3px;
margin-left:3px;
float:left;
border:1px solid #CCCCCC;
/*position:absolute;
left:292px;
top: 523px;*/
}
#palavra_bispo {
width:220px;
height:130px;
margin-top:3px;
margin-left:3px;
float: left;
border:1px solid #CCCCCC;
/*position:absolute;
left:292px;
top: 523px;*/
}
#noticias {
width:225px;
height:252px;
margin-top:3px;
margin-left:3px;
float: left;
border:1px solid #CCCCCC;
}
#videos {
width:220px;
height:130px;
margin-left:3px;
float: left;
border:1px solid #CCCCCC;
margin-top: 3px;
clear: none;
position: absolute;
top: 506px;
left: 573px;
}
#eventos {
width:220px;
height:138px;
margin-top:3px;
margin-left:3px;
float: left;
border:1px solid #CCCCCC;
position: absolute;
left: 573px;
top: 641px;
}
#rodape {
clear:both;
text-align:center;
border:1px solid #CCCCCC;
}
Será muito bem vinda a ajuda de vcs!
Carregando comentários...