Dessinez un div 'over' éléments qui peuvent être ci-dessous

Question

Je tente de dessiner un div sur les éléments en dessous de la page à un point spécifique de la page. Je voudrais que le div dessine au-dessous des éléments plutôt que de dessiner en haut de la page en poussant tous les autres éléments vers le bas.

Actuellement l'effet que j'ai .. est

_________________ 
|  |   | 
|DIV |   | 
|  |   | 
|_____|   | 
|    | 
|    | 
| CONTENT  | 
|    | 
|_______________| 

Ce que je veux ..

_________________ 
|  |   | 
| DIV | CONTEN | 
|  |   | 
|_____|   | 
|    | 
|________________| 

Comment puis-je atteindre cet objectif? Voici le style de la div que j'ai actuellement ...

#laydiv{ 
margin:10px; 
background:url(../lightbg.jpg); 
border: 3px solid #fff; 
width: 500px; 
height:auto; 
position: fixed; 
float:left; 
left: 0pt; 
top: 0px; 
z-index: 2000000000; 
/* CSS3 styling for latest browsers */ 
-moz-box-shadow: 2px 2px 10px #000; 
-webkit-box-shadow: 2px 2px 10px #000; 
-moz-border-radius: 5px; 
-webkit-border-radius: 5px; 
} 

Answer 1

Si vous faites la div intérieure float:left; alors tout le reste devrait l'enserrent comme vous l'avez illustré.

<div style="width:220px;height:200px;border:1px solid red"> 
    <div style="float:left;width:50px;height:100px;border:1px solid green;margin-right:10px;">hello</div> 
    More content flows here<br />More content flows here<br />More content flows here<br />More content flows here<br />More content flows here<br />More content flows here<br />More content flows here<br /> 
</div>