Ir para conteúdo

POWERED BY:

Arquivado

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

Mi moreira

Div pai não acompanha div filho

Recommended Posts

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
<!--
* {
margin: 0px;
padding: 0px;
}
#tudo {
width: 800px;
height: auto;
background-color: #006699;
margin-right: auto;
margin-left: auto;
}
#tudo #conteudo {
background-color: #009966;
}
#tudo #conteudo #esquerda {
background-color: #FF0000;
float: left;
width: 400px;
}
#tudo #conteudo #direita {
float: left;
width: 400px;
}
-->
</style>
</head>

<body>
<div id="tudo">
 <div id="conteudo"><div id="esquerda">esquerda<br />
 </div>
 <div id="direita">direita<br />
 </div>
</div></div>
</body>
</html>

 

Olá pessoal tudo bem?

 

enfim sou novo no mundo css e to sofrendo com algo que não consigo resolver de jeito nenhum! acima deixei o codigo , simples e pequeno, quem puder me ajudar ficarei eternamente grato!

 

enfim.. o que aconteceu é que..

 

existem 4 divs

 

tudo

conteudo

direita e esquerda

 

tudo tem fundo azul

conteudo tem fundo verde.

 

e direita tem fundo vermelho e esquerda tem fundo transparente para ver se funciona.

 

eu preciso URGENTE! que o fundo do CONTEUDO, siga as divs direita e esquerda, ou seje. ele segue talz, mais quando coloco, float:right na direita e float:left na esquerda, o fundo do #conteudo e do #tudo desparece

 

eu preciso que o fundo do #conteudo, siga o txto e imagems que eu fizer no esquerda ou direita, a unica solução que tive até agora é colocar no height do conteudo um valor, mais como cada pagina tem um tamanho de texto e imagens, eu teria que fazer uma div para cada pagina e daria muito trabalho...

 

como faço para que a div conteudo acompanhe o tamanho da div esquerda e direita?

 

obrigado des de já

Compartilhar este post


Link para o post
Compartilhar em outros sites

muda a altura do conteudo para height:100%;

 

Olá rodrigo, obrigado pela atenção!

 

infelizmente não funcionou, coloquei no height, 100% e não deu resultado, vou enviar o codigo fonte com a modificação ok?

 

muito obrigado!

 

<html>
<head>
<title>Untitled Document</title>
<style type="text/css">
<!--
* {
margin: 0px;
padding: 0px;
}
#tudo {
width: 800px;
height: auto;
background-color: #006699;
margin-right: auto;
margin-left: auto;
}
#tudo #conteudo {
background-color: #009966;
height: 100%;
}
#tudo #conteudo #esquerda {
background-color: #FF0000;
float: left;
width: 400px;
}
#tudo #conteudo #direita {
float: left;
width: 400px;
}
-->
</style>
</head>

<body>
<div id="tudo">
 <div id="conteudo"><div id="esquerda">esquerda<br />
   <br />
 </div>
 <div id="direita">direita444<br />
   <br />
 </div>
</div></div>
</body>
</html>

Compartilhar este post


Link para o post
Compartilhar em outros sites

Boa noite Michael Carlos Pedroso,

 

Olhei seu html e achei pequenos erros na ordem do html.

A imagem abaixo segue com as alterações. :natalhappy:

 

001.jpg

 

Abraço espero ter ajudado!

Compartilhar este post


Link para o post
Compartilhar em outros sites

Coloque no CSS da div que você quer

overflow:hidden;

Propriedade overflow: http://www.w3schools.com/cssref/pr_pos_overflow.asp

(É importante que você leia, pois nesse mesmo código você pode usar outros valores como scroll, auto)

 

Isso não serve pra nada:

height:auto;

E apesar de eu não achar que serve muito também, você pode usar height:100%; nas divs da esquerda e direita, elas vão seguir a página.

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

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