Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
olá, queria saber se alguém pode me ajudar:
to fazendo um layout onde o div lateral < deve ocupar 100%, fiz, funciona certinho, reajustando a resolução da tela, tudo tudo, ele sempre pega 100%, porém, quando o div de conteúdo >> excedo o tamanho da tela, o menu não acompanha, alguem pode me ajudar ? css:
#top {
background:#E33553;
border-bottom:2px solid #AA273F;
width:100%;
height:57px;
}
#nav {
background:none;
width:240px;
height:100%;
float:left;
position:absolute;
margin-top:-59px;
}
#content {
background:#DDD;
width:auto;
height:800px;
margin-left:240px;
}
e o html:
<div id="top"></div>
<div id="nav"></div>
<div id="content">Conteudo</div>
ja achei vários posts, tanto aqui quanto em outros sites (inclui maujor) porém nenhum conseguiu solucionar, alguem poderia me ajudar ?
PS: uma "gambiarra" que eu armei, e funcionou é a seguinte:
$('#nav').height($(document).height());
porém, não queria arrumar isso na base da gambiarra, e outra, caso carregue algo dinamicamente na página e o div de conteudo aumente", o menu acaba nao acompanhando também e outra, quando redimensiona a tela, também não funciona
Ops, postei na área errada, é costume de postar aqui, hahah, se puderem mover agradeço.
ajudaria bastante
explica o que você ta querendo fazer, pois ali não deu pra entender direito!
você quer criar um topo e dentro desse topo um menu centralizado com um content e isso ? ou você quer que seu nav acompanhe o height de alguma div ?
explica ae.
EDIT
Ja entendi, executei seu codigo aqui, já ja eu posto.
gui, o que to fazendo é um painel de administração estilo bootstrap, barra no topo, menu fixo ao lado < e conteudo ao lado >
eu tive que sair, to pelo celular! quando eu chegar se ninguém já tiver ajudado ai eu te ajudo ok.
tranquilo, brigadão o/
Mateus vou ver aqui!
olha ae se e isso que você ta querendo.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
*{margin: 0;padding: 0;}
html, body {
height: 100%;
width: 100%;
}
body {
position: absolute;
}
#top {
background:#E33553;
border-bottom:2px solid #AA273F;
width:100%;
height:57px;
}
#nav {
background:blue;
width:240px;
height:100%;
float:left;
}
#content {
background:#DDD;
width: 82.32275109170306%;
height: 100%;
margin-left: 240px;
display: table;
}
</style>
</head>
<body>
<div id="top"></div>
<div id="nav"></div>
<div id="content"><h1 align="center">Conteudo</h1>
</div>
</body>
</html>
propriedade height não e bom usar % , utilize max-height ou auto.
e se você que trabalhar com layout fluído, você deve trabalhar em cima de um contexto!
não da pra te ajudar muito, pois você falou de div lateral e postou um codigo o qual não se identifica com o que ta querendo, pois nem uma div ai e filha de outra.
crie uma div geral com tamanho de 100% ou menos, isso de acordo com o contexto do seu site, e trabalhe as % das outras dives com base nele, e só use % em width e nunca em height.
e procura usar id em div só quando necessário mesmo, use classes.
se você não entendeu o que eu quis dizer posso criar um exemplo pra você ok? :yes: