Problemas com Div

Paulo Alberto · Julho 24, 2012

Bom dia Galera,

Bom, gostaria de saber como eu posso estar alinhando a div "rodape_barra" no meio da página(centralizada), ela extrapola o limite da div "tudo" e gostaria de deixar 30 px pra cada lado extrapolando esse limite



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>

	<title>Teste</title>
	<link rel="stylesheet" type="text/css" href="external.css" />
	&lt;script LANGUAGE="javascript" TYPE="text/javascript">
	</script>


</head>
<body>

<div id="tudo">

	<div id="logo">

	</div>
	<div id="menu">
	</div>
	<div id="banner">
	</div>
	<div id="submenu">
	</div>
	<div id="meio_esq">
	</div>
	<div id="meio_dir_top">
	</div>
	<div id="meio_dir_bottom">
	</div>
	<div id="rodape_barra">
	</div>
	<div id="rodape_menu">
	</div>
	<div id="rodape">
	</div>
</div>
</body>
</html>

[/codebox]

[codebox]

* {
margin:5px;
padding:0;
}

#tudo {
width: 902px;
height: 1272px;
background-color: white;
margin-left: auto;
margin-right: auto;
border:1px solid white;

}

#logo {

background-color: white;
width:450px;
height:130px;
float:left;
border:1px solid gray;
padding: 0px;
margin-left: 0;
margin-right: 0;
margin-top: 0;
margin-bottom: 2px;
}
#menu
{
background-color: white;
width:450px;
height:130px;
margin:0 450px;
margin-left: 450px;
margin-right: 0;
margin-top: 0;
margin-bottom: 2px;
border:1px solid gray;

}

#banner {
border:1px solid gray;
width: 900px;
height: 260px;
margin-left: 0;
margin-right: 0;
margin-top: 0;
margin-bottom: 2px;
background-color: white;
}

#submenu {
border: 1px solid gray;
width: 900px;
height: 70px;
margin-left: 0;
margin-right: 0;
margin-top: 0;
margin-bottom: 2px;
background-color: white;

}
#meio_esq {
border: 1px solid gray;
width: 600px;
height: 500px;
margin-left: 0;
margin-right: 0;
margin-top: 0;
margin-bottom: 2px;
background-color: white;
float: left;
}
#meio_dir_top {
border: 1px solid gray;
width: 300px;
height: 250px;
margin:0 598px;
margin-left: 600px;
margin-right: 0;
margin-top: 0;
margin-bottom: 0;
background-color: white;
}

#meio_dir_bottom {
border: 1px solid gray;
width: 300px;
height: 248px;
margin:0 598px;
margin-left: 600px;
margin-right: 0;
margin-top: 0px;
margin-bottom: 2px;
background-color: white;
}

#rodape_barra {

border: 1px solid gray;
width: 960px;
height: 62px;
margin-left: 0;
margin-right: 0;
margin-top: 0;
margin-bottom: 2px;
background-color: white;

}

#rodape_menu {

border: 1px solid gray;
width: 900px;
height: 162px;
margin-left: 0;
margin-right: 0;
margin-top: 0;
margin-bottom: 2px;
background-color: white;
float: left;
}

#rodape {

border: 1px solid gray;
width: 900px;
height: 62px;
margin-left: 0;
margin-right: 0;
margin-top: 0;
margin-bottom: 2px;
background-color: white;
float: left;
}

body { background-color: #6D6D6D; }

Editado Julho 25, 2012 por Paulo Alberto

Nosreve · Agosto 22, 2012

ola

basta colocar um position relactive, e colocar um left - 30px

assim

#rodape_barra {
    position:relative;
    left:-30px;    
    border: 1px solid gray;
    width: 960px;
    height: 62px;
    margin-left: 0;
    margin-right: 0;
    margin-top: 0;
    margin-bottom: 2px;
    background-color: white;    
}

JaguA · Agosto 23, 2012

o reset

*{
}

é feito para resetar evite colcoar magens e bordas e padding nela sempre aplique direto na div ou paragrafo que ira fazer.

Entrar

Problemas com Div

Pergunta

Paulo Alberto

Link para o comentário

Compartilhar em outros sites

2 respostass a esta questão

Posts Recomendados

Nosreve

Link para o comentário

Compartilhar em outros sites

JaguA

Link para o comentário

Compartilhar em outros sites

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades