Ir para conteúdo

Arquivado

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

Biel.

div

Recommended Posts

Boa noite a todos. Direto ao ponto. Pessoal neste link temos breve "layout" com div principal 80%
Quando diminuo a resolução um pouco antes mesmo de atingir 400px a div direita fica debaixo da div esquerda.
Gostaria que a div esquerda ficasse debaixo da div direita somente quando a resolução atingisse 400px e não antes
Todo o código na integra.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>

<meta name="author" content="teste.com.br"/>
<meta name="robots" content="index,follow" />
    
<style type="text/css" media="screen">
* { margin:0; padding: 0; } 

body{ text-align:center; color:#434343; font-size:14px; font-weight:normal;
font-family:Verdana, "Trebuchet MS", Tahoma, Arial, calibri, Cambria;
}

#principal{width:80%; height:auto; margin:auto; background-color:#9999CC; }

#esquerda {width:210px; height:auto; float:left; text-align:left; background-color:#CC99FF; }

#direita{float:left; width:80%; height:auto; background-color:#9966FF; }

#clear { height:50px; clear:both; background-color:#996; }

</style>


</head>

<body>

<div id="principal"> 

<!-- ######################################################################### -->
<div id="esquerda">
gdfgdf f gdfg  fdg gfd gg fd df gg dfggg fdgdfg dfgdfgfd dfgdfgg fdgfdgfdgdf gdg dfgf dfg dfg f dfg dfg dsf fdsfds fdfsd sdf sd  sd fsd sdfsd sdfsdff sd sdf sdf sdfsdff sdfsdfs dsfsdfsd fs fsdfsd sdfsdf fsdf sdf sdfsdf sdfsd dsf sdfd sdsd s sdfsd fsdfs  fsdf dsf s

</div>

<div id="direita">

hghfh hgfh h fgh ghgh h gfh ghgf hgfh fg h fgh hghghgf hgfh ghghg  hfghgfh hg h gfhgh  gh gf hh gfh gfhgf hh fghgf hgfh gh gfh fgh gfh fg hgf hghfh hgfh h fgh ghgh h gfh ghgf hgfh fg h fgh hghghgf hgfh ghghg  hfghgfh hg h gfhgh  gh gf hh gfh gfhgf hh fghgf hgfh gh gfh fgh gfh fg hgf hghfh hgfh h fgh ghgh h gfh ghgf hgfh fg h fgh hghghgf hgfh ghghg  hfghgfh hg h gfhgh  gh gf hh gfh gfhgf hh fghgf hgfh gh gfh fgh gfh fg hgf hghfh hgfh h fgh ghgh h gfh ghgf hgfh fg h fgh hghghgf hgfh ghghg  hfghgfh hg h gfhgh  gh gf hh gfh gfhgf hh fghgf hgfh gh gfh fgh gfh fg hgf hghfh hgfh h fgh ghgh h gfh ghgf hgfh fg h fgh hghghgf hgfh ghghg  hfghgfh hg h gfhgh  gh gf hh gfh gfhgf hh fghgf hgfh gh gfh fgh gfh fg hgf hghfh hgfh h fgh ghgh h gfh ghgf hgfh fg h fgh hghghgf hgfh ghghg  hfghgfh hg h gfhgh  gh gf hh gfh gfhgf hh fghgf hgfh gh gfh fgh gfh fg hgf hghfh hgfh h fgh ghgh h gfh ghgf hgfh fg h fgh hghghgf hgfh ghghg  hfghgfh hg h gfhgh  gh gf hh gfh gfhgf hh fghgf hgfh gh gfh fgh gfh fg hgf hghfh hgfh h fgh ghgh h gfh ghgf hgfh fg h fgh hghghgf hgfh ghghg  hfghgfh hg h gfhgh  gh gf hh gfh gfhgf hh fghgf hgfh gh gfh fgh gfh fg hgf hghfh hgfh h fgh ghgh h gfh ghgf hgfh fg h fgh hghghgf hgfh ghghg  hfghgfh hg h gfhgh  gh gf hh gfh gfhgf hh fghgf hgfh gh gfh fgh gfh fg hgf hghfh hgfh h fgh ghgh h gfh ghgf hgfh fg h fgh hghghgf hgfh ghghg  hfghgfh hg h gfhgh  gh gf hh gfh gfhgf hh fghgf hgfh gh gfh fgh gfh fg hgf 

</div>


<!-- ######################################################################### -->
<div id="clear"> </div>
</div>


</body>
</html>

 

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.