Jump to content


Bruno Oliveira (Funny)

Member Since 16/06/2009
Offline Last Active 19/02/2011, 22:20
-----

#1007858 Dúvida E Problema Com Height 100%

Posted by Bruno Oliveira (Funny) on 19/02/2011, 19:13

Olá pessoal, faz um bom tempo que não posto aqui... mas estou empacado com esse problema simples, estou tentando criar um layout base mas estou com problemas ao utilizar o height: 100%. Abaixo o código e um screenshot:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
            "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<title>teste</title>
	
		<meta http-equiv="pragma" content="no-cache" />
		<meta http-equiv="cache-control" content="no-cache" />
		<meta http-equiv="expires" content="-1" />
		<meta http-equiv="Content-type" content="text/html; charset=utf8" />
		
		<style>
html , body {
	border: 0;
	margin: 0;
	padding: 0;
	height: 100%;
}

body {
	background-color: #CCCCCC;
	background-image:url('../images/body-bg.jpg');
	background-repeat:repeat-x;
}

#corpo {
	width: 900px;
	height: 100%;
	margin: 0 auto;
}

#cabecalho {
	position: relative;
	width: 100%;
	height: 135px;
}

/*#cabecalho .logo {
	margin: 70px 0 0 10px;
}*/

#menu {
	float: left;
	width: 200px;
	height: 100%;
	background-color: #666666;
	min-height: 100%;
}

#conteudo {
	float: right;
	width: 700px;
	height: 100%;
	background-color: #FFFFFF;
	min-height: 100%;
}

#rodape {
	clear: both;
	width: 100%;
	text-align: center;
}
                </style>
		
	</head>
	
	<body>
		<div id="corpo">
		
			<div id="cabecalho">
				teste
			</div>
			
			<div id="menu">
				<ul>
					<li>Item 1</li>
					<li>Item 2</li>
					<li>Item 3</li>
					<li>Item 4</li>
					<li>Item 5</li>
				</ul>
			</div>
			
			<div id="conteudo">
				Conteúdo
			</div>
			
			<div id="rodape">
				<p>Todos os direitos reservados e etc...</p>
			</div>
		
		</div>
		
	</body>
	
</html>


O problema é que além de gerar a barra, quando a div #conteudo estoura a barra já criada ao exibir a página, o fundo branco não acompanha o conteúdo.

Alguém pode me explicaro por que ?
Alguma falha no projeto das divs ?

Grande abraço a todos.

Attached Files

  • Attached File  test.jpg   45.03KB   3 downloads



IPB Skin By Virteq