[résolu] CSS : problème de DIV imbriqués

[RaphAstronome]

Bonjour,

Pour l'instant pour mettre du texte et une image à coté je met

<table>
<tr><td colspan="2">titre</td></tr>
<tr><td>texte</td><td>image</td></tr>
</table>

Ca marche bien mais ce n'est pas un vrai tableau.

J'aimerais pour mes prochains documents faire un peu plus propre en utilisant des <div>

<div style="background-color: #330000; display:block;">
<div style="float:right;display:block;">Image</div>
Titre et texte
</div>

Le "background-color" est là pour bien mettre en valeur le problème.

Le problème est que le premier div n'inclut pas l'image, qui déborde alors sur les paragraphes suivants. Un exemple :

Ici le cadre sur fond rouge devrait être beaucoup plus long et descendre jusqu'en bas de l'image quitte à laisser de l'espace après le texte.

[AllFull]

Bonjour,

c'est cadeau

<div style="background-color: #330000; display:block;">
<div style="float:right;display:block;">Image</div>
Titre et texte
<div style="font-size:1px; height:1px; clear:both;"> </div>
</div>

Il te manque un DIV (ou autre, mais le DIV fonctionne à tous les coups) avec en style "clear:both" qui te permet d'annuler le float. Comme le DIV qui contient le fond n'est pas encore terminé et que l'image est bien positionné à droite, cela te dispose le fond comme tu l'attendais.

AllFull

[RaphAstronome]

ok, merci j'avais complètement zappé le "clear"