[Resolvido] alguem pode me r na ordenaçao?!
Oi! por favor alguem pode me ajudar na ordenação do meu layout :unsure:
meu bloco da esquerda ele tah grudado no conteudo eh tinha que ficar separado que nem o bloco da direita..
se alguem puder me dar uma luz ficaria grata! http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>:: MDnet Soluções em Tecnologia -
Home ::</title>
<style type="text/css">DIV.imagem1 {
position: relative;
top: 0px;
left: 0px;
margin-left:0px;
margin-top:0px;
}DIV.imagem2 {
position: relative;
top: 383px;
left:0px;
margin-left:0px;
margin-top:-40px;
}
body { margin: 0px;
position: relative;
padding: 0px;
font-family:Arial, Helvetica, sans-serif;
color:#000000;
}
#container { border: solid 1px #a2b1b8; margin: 0 auto;
display: table;
right: 235;
top: 0px;
width: 770px;
height: 550px;
}
#topo { width: auto;
height: 150px;
background: #000000;
}
#esquerda { height: 300px;
float: left;
width: 110px;
padding: 0px;
background: #80b5d3;
margin-top: 10px;
}
#esquerda li{ list-style: none; padding: 1px 1px;
display:block;
background: #80b5d3; margin-left: 0px;
}
#esquerda li:hover{ list-style: none;
display:block;
background: #EAEAEA;
margin-left: 0px;
text-decoration:underline;
}
#esquerda ul{ list-style: none;
padding-left: 5px;
padding-top: 10px;
margin-left: 0px;
}
#direita { height: 300px; width: 160px;
float: right;
background: #80b5d7;
margin-top: 10px;
}
#conteudo { margin: 10px 170px;
height: 300px;
background:#cee0ea;
}<!--
ul#menu {
list-style: none;
background: #f1f1f1;
margin: 0;
padding: 0;
width: 170px;
border-top: 0px solid #f7f7f7;
}ul#menu li {
border-bottom: 0px solid #f9f9f9;
}ul#menu li a {
width: 140px;
height: 18px;
display: block;
padding-top: 2px;
padding-left: 3px;
text-decoration: none;
color: #000;
font: 12px Verdana;font-weight:bold
}
ul#menu li a:hover {
background: #E1E8F8;
color: #085d94;
width: 120px;
}-->
<!--[if IE]>
<style type="text/css">
ul#menu li a, ul#menu li a:hover{
width: 120px;
}
</style><![endif]>
</head>
<body>
<div id="container">
<div class="imagem1"><img style="width: 770px; height: 145px;" src="banner.jpg"></div>
<div class="imagem2">
<img style="width: 770px; height: 63px;" src="rodape.jpg">
</div>
<div id="esquerda">
<ul id="menu">
<li><a href="#">Empresa</a></li>
<li><a href="#">Serviços</a></li>
<li><a href="#">Download</a></li>
<li><a href="#">Contato</a></li>
<li><a href="#">Suporte on-line !</a></li>
</ul>
</div>
<div id="esquerda"></div>
<div id="direita"></div>
<div id="conteudo"></div>
</div>
</body>
</html>Discussão (5)
Carregando comentários...