Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Diego Mengarda

Layout Fluido com Div 100% height

Por , em Desenvolvimento frontend

Recommended Posts

Diego Mengarda    0

Diego Mengarda
Postado

Eai galera, to quebrando a cabeça aqui e não consegui fazer uma coisa.

 

Tenho um layout fluido com um menu do lado esquerdo e uma div.conteudo que pega a largura restante da página.

Gostaria que essa div tivesse altura de 100%, ela até que está fazendo isso mas está criando uma rolagem no final da página.

 

Alguem saberia como fazer isso sem precisar usar javascript.

 

Aqui está meu código.

 

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style type="text/css">
html {
height: 100%;
}
body {
background-color:#000;
margin:0;
padding:0;
height: 100%;
}
.corpo {
height:100%;
width:100%;
}
.topo {
height:100px;
background-color:#999;
width:100%;
margin:0 0 15px 0;
}
.menu {
background-color:#093;
width:250px;
height:600px;
float:left;
}

.conteudo {
margin:0 0 0 265px;
background-color:#FFF;
min-height: 100%;

}
</style>
</head>

<body>

<div class="corpo">

<div class="topo"></div>

<div class="menu"></div>    

   <div class="conteudo">gdf</div>

</div>

</body>
</html>

 

Fico no aguardo.

 

Abraço.

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

Dá uma lida aqui:

 

http://www.maujor.com/tutorial/rodape-embaixo-da-janela.php

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

@Wanderson,

 

    top: 0;
   right: 0;
   bottom: 0;
   left: 0;

isso não faz nenhum sentido.

 

se você num video game, apertar as direcionais esquerda e direita ao mesmo tempo, oq acontece com o personagem ?

NADA.

 

 

Ou você declara top ou bottom,

ou left ou right. As duas direcionais do mesmo sentido não fazem nenhum sentido se declaradas juntas.(a ultima não terá efeito).

Compartilhar este post

Link para o post
Compartilhar em outros sites

Diego Mengarda    0

Diego Mengarda
Postado

Pessoal, eu não quero criar uma única div 100%, isso eu sei fazer...

 

Quero que a div.conteudo do meu exemplo fiquei com 100% de altura até o finala da página.

 

Obrigado.

 

 

No momento que eu definir algum position na minha div.conteudo vou perder o efeito do layout fluido.

Nesse caso não vai me ajudar :/

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

não perde não cara.. pode fazer.

 

position relative não vai matar o teu layout fluido. Pode seguir esse tuto do link q te mandei.

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito