J'essaie de mettre deux divs du côté droit du parent div un au-dessus d'une autre. Quelque chose comme ceci: des idées Comment le faire en utilisant CSS? Je ne peux pas utiliser les tables ici car Div # Up est ajouté dans la page principale (ASP.NET) et DIV # Down est ajouté dans le contenu. DIV # Parent est liquide avec une certaine partie de largeur minimale et contient du contenu qui ne doit pas se chevaucher par ces divs, donc je pense que la position: Absolute est hors de question ici aussi. P> Un détail: à gauche et Droit de Div # Parent là-bas Ale DIVS flotté à gauche et à droite avec des menus. Ajout de clair: gauche / droite pour diviser le droit flotté à droite la place sous l'un de ces menus ... p> p>
3 Réponses :
Personnellement, je les envelopperais dans un récipient div et de lui donner une largeur et de le flotter correctement.
#sidebar{ width: 250px; float: right; }
Il ne peut pas ajouter un autre div autour de ces deux comme ils sont ajoutés par différents composants du système. C'est pourquoi une solution de table est hors de question pour lui.
Vous devez utiliser les deux float: droite code> et
effacer: droite code>, ce qui garantit que le côté droit de l'élément est dégagé au bord de l'élément contenant .
<div id="parent" style="width: 80%">
<div id="up" style="float: right; clear: both;">div with id 'up'</div>
<div id="down" style="float: right; clear: both;">div with id 'down'</div>
'parent' div
</div>
Cela fonctionne presque, mais comme je l'ai écrit, j'ai flotté des menus à gauche et à droite et en utilisant des causes claires mes divs pour y passer. Y a-t-il un moyen de prévenir ce comportement?
Vous devez probablement juste changer le CSS en utilisant uniquement Clear: Droite; Code>
Vous devez vous assurer que le bloc parent ( http://www.w3.org/tr/css2 /visuren.html#Block-Formatting P>
Voici une preuve, que je l'ai bien compris cette fois: http://jsfiddle.net/pagqx/ a> p>
Désolé pour la confusion. P> #parent code> dans votre cas) devient le contexte de mise en forme du bloc de la divs
#up code> et
#down < / Code>, de sorte que toute clairière ne se produise que dans ce contexte de mise en forme du bloc et ignore les flotteurs en dehors de celui-ci. Le moyen le plus simple de le faire est généralement de laisser
#parent code> float, aussi ou de lui donner un
débordement code> autre que
visible p >