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!
Não sei o que estou fazendo de errado no meu código, pois a div #redessociais está totalmente desalinhada com a div #conteudo.
além deste problema, preciso alinhar as duas de tal forma que fiquem alinhadas verticalmente com o topo, como devo proceder?
Segue os códigos:
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=utf-8" />
<title>GS Assessoria Desenvolvimento de Software</title>
<link rel="stylesheet" type="text/css" href="gs.css" />
</head>
<body>
<div align="center" id="topo">
</div>
<div align="center" id="menu">
<ul>
<li><a href=".../index.html">Início</a></li>
<li><a href=".../institucional.html">Empresa</a></li>
<li><a href=".../produtos.html">Produtos / Serviços</a></li>
<li><a href=".../empregos.html">Trabalhe Conosco</a></li>
<li><a href=".../faleconosco.html">Contato</a></li>
<li><a href=".../ondeestamos.html">Localização</a></li>
<li><a href=".../downloads.html">Downloads</a></li>
</ul>
</div>
<div id="conteudo">
<h2>TESTANDO CONTEUDO</h2>
</div>
<div id="redessociais">
<h1>TESTANDO RS</h1>
</div>
<div id="rodape">
</div>
</body>
</html>CSS
@charset "utf-8";
/ Documento CSS GS Assessoria /
/ Desenvolvido por Melina - @meehpg /
body{
background:url(../Bckg.png);
background-repeat:repeat-x;
background-color:#0066FF;
font-family:Georgia, "Times New Roman", Times, serif;
margin-left: 10%;
margin-right: 10%;
}
h1 {
text-align:left;
font-size:24px;
margin-left: 10px;
color:#003;
}
h2 {
text-align:left;
font-size:18px;
margin-left: 10px;
color:#076FA0;
}
h3 {
text-align:center;
font-size:18px;
color:#076FA0;
}
h4 {
text-align:right;
font-size:16px;
margin-right: 10px;
color:#F24800;
}
#topo {
background-image:url(../PaginaGeralTopo.png);
text-align:center;
margin-left: auto;
margin-right:auto;
display:block;
width:1000px;
height:221px;
}
#menu ul{
width: 80%;
list-style:none;
margin:0px;
padding-top:4px;
text-decoration:none;
}
#menu ul li {display:inline;}
#menu ul li a{
padding:2px 15px;
text-decoration:none;
background-color:#FBFBFB;
color:#333;
border-left:1px solid #A3A3A3;
border-right:1px solid #A3A3A3;
border-radius: 5px;
}
#menu ul li a:hover {
text-decoration: none;
background-color:#003;
color:#FFF;
border-left:1px solid #FFF;
border-right:1px solid #FFF;
}
#conteudo {
margin-top:10px;
width:750px;
height:400px;
background-color:#FFF;
border-left:1px solid #A3A3A3;
border-right:1px solid #A3A3A3;
border-radius:5px;
}
#redessociais {
float:right;
margin-top: 10px;
width: 200px;
height:400px;
background-color:#C39;
border-left:1px solid #000;
border-right:1px solid #000;
border-radius:10px;
}
#rodape {
width:1000px;
height:100px;
display:block;
margin-top:15px;
background-color:#FFF;
border:1px solid #A3A3A3;
border-radius:10px;
clear:both;
}Segue duas imagens de como está:
/applications/core/interface/imageproxy/imageproxy.php?img=http://img38.imageshack.us/img38/3061/img1imasters.png&key=f2f9ade48106448653d4e3ba39183390ed42dd44ebda517a37fafeb62913393d" alt="img1imasters.png" />
/applications/core/interface/imageproxy/imageproxy.php?img=http://img109.imageshack.us/img109/3329/img2imasters.png&key=81e5ad88df50b2701843a0976d2f747823ea14f76245bf6e27c3b77cef732dc1" alt="img2imasters.png" />
Como podem ver, a "linha", onde está o conteúdo e o topo estão desalinhados, e deveriam estar alinhados verticalmente.
Se houver alguma redundância ou algum problema no meu código, por favor me informem.. pois voltei há pouco tempo, digo, faz umas 2 semanas a programar novamente.. rs
Muito obrigado !
:lol:
Carregando comentários...