Div mudando de posicao conforme resolucao
Fala pessoal, to tendo um problema, nao sei porque ta acontecendo, nesse site que to fazendo, em cada resolucao a div fica numa posicao diferente, alguem por favor pode me ajudar?
codigo:
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Recanto Sertanejo</title>
<link href="css/estilo.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="container">
<div id="menu">
<?php require 'modulos/menu.php'; ?>
</div>
<div id="cont">
<div id="topo">
<div id="banner"><?php require 'modulos/banner.php'; ?></div>
</div>
<div id="conteudo">
<div id="rsocial"><?php require 'modulos/rsocial.php'; ?></div>
<div id="cobertura"><?php require 'modulos/cobertura.php'; ?></div>
<div id="programacao"><?php require 'modulos/programacao.php'; ?></div>
<div id="parque"><?php require 'modulos/parque.php'; ?></div>
<div id="bonusrevista"><?php require 'modulos/bonusrevista.php'; ?></div>
<div id="facebook"><?php require 'modulos/facebook.php'; ?></div>
<div id="parceiros"><?php require 'modulos/parceiros.php'; ?></div><br />
</div>
</div>
<div id="rodape">
<img src="images/violao.png" alt="violao" />
</div>
</div>
</body>
</html>
@charset "utf-8";/ CSS Document /
* {
padding:0;
margin:0;
font-family:Verdana, Geneva, sans-serif;
}body {
text-align:center;
background:black;
}img {
border:none;
}
#container {
background:url(../images/bg.png);
width:1025px;
margin:auto;
}
#menu {
width:1000px;
height:100px;
}
#menu img {
position:absolute;
left: 160px;
top: -30px;
}
#cont {
width:900px;
background:black;
margin:auto;
}
#topo {
padding-top:50px;
height:400px;
}
#banner {
background: url(../images/molde.png) no-repeat center 100%;
height: 370px;
}
#conteudo {
width:800px;
margin:auto;
}
#rsocial {
position: absolute;
left: 810px;
top: 525px;
}
#rsocial a {
margin-left:20px;
}
#cobertura {
background:url(../images/ultimascoberturas.png) no-repeat;
width:900px;
height:230px;
margin-left:-50px;
margin-top: -20px;
}
#cobertura ul {
float:left;
list-style:none;
margin-top:100px;
}
#cobertura ul li {
float:left;
list-style:none;
margin-left:30px;
}
#cobertura ul li p {
color:#0b0202;
margin-top:10px;
font-weight:bold;
}
#programacao {
background:url(../images/programacao.png) no-repeat;
width: 470px;
height: 343px;
margin-top: 50px;
margin-left: -50px;
}
#programacao img {
margin-top: 70px;
margin-left: -5px;
}
#parque {
background:url(../images/conhecaoparque.png) no-repeat;
width: 400px;
height: 343px;
margin-left: 450px;
margin-top: -343px;
}
#parque img {
margin-top:100px;
}
#bonusrevista {
background:url(../images/bonuserevista.png) no-repeat;
width:470px;
height:189px;
margin-top:30px;
margin-left:-50px;
}
#bonusimg {
position:absolute;
top: 1250px;
left: 220px;
}
#revistaimg {
position:absolute;
top: 1250px;
left: 500px;
}
#facebook {
background:url(../images/facebook.png) no-repeat;
width: 400px;
height: 288px;
margin-left: 450px;
margin-top: -200px;
}
#facebook img {
margin-top: 100px;
margin-left: 50px;
}
#parceiros {
background:url(../images/parceiros.png) no-repeat;
width: 900px;
height: 214px;
margin-left: -50px;
margin-top: -20px;
margin-bottom:20px;
}
#parceiros ul {
float:left;
list-style:none;
margin-top: 130px;
margin-left: 50px;
}
#parceiros ul li {
float:left;
list-style:none;
margin-left:30px;
}
#rodape {
background:url(../images/bgrodape.png);
width:1025px;
height:132px;
}
#rodape img {
position:absolute;
top: 1400px;
left: 160px;
}Discussão (9)
Carregando comentários...