texte d'emballage autour d'un div

Question

J'ai une mise en page comme ceci:

Header div 
divLeft divRight 
Footer div 

divLeft est un tas de texte et divRight est un div avec des trucs dedans. divLeft est beaucoup plus long et j'aimerais que le texte s'enroule sous divright. En ce moment, il fait juste deux colonnes et il y a beaucoup d'espace blanc sous divRight. Aidez-moi? Merci!

Answer 1

Mettez divRight à l'intérieur de divLeft et faites-le flotter.

Essayez ceci:

CSS

<style type="text/css"> 
#primary, #header, #footer { 
    float: left; 
    width: 100%; 
} 

#secondary { 
    float: right; 
     width: 200px; /* or whatever width you want */ 
} 
</style> 

HTML

<div id="header"> 
</div> 
<div id="primary"> 
    <div id="secondary"> 
     <p>Put your content here that goes on the right</p> 
    </div> 
    <p>Put your content here<br /> 
     that goes on the left<br /> 
     and should wrap under the right-hand column</p> 
</div> 
<div id="footer"> 
</div> 

Answer 2

Vous pouvez flotter divRight droite. Cela devrait permettre à la div de gauche d'envelopper dans le bon texte.

Editer: Vous aurez également besoin de divRight à l'intérieur de divLeft comme décrit par Donut.

Answer 3

J'ai une très bonne solution; jetez un oeil à la source de l'exemple here.

Answer 4

place divRight à l'intérieur divLeft et lui donner ces propriétés:

.divRight { 
    display: inline-block; 
    display: -moz-inline-box; 
    -moz-box-orient: vertical; 
    vertical-align: top; 
    zoom: 1; 
    *display: inline; 
}