• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Bild und Text außerhalb des Divs

ro-mann

ro-mann

Neues Mitglied
Hallo!

Ich habe ein Problem, ich will in einem div eine Üverschrift, dann in der nächsten Zeile ein Bild und rechts daneben einen Text haben. Nun passt sich das Div aber nicht an die Größe an und Bild und Text ragen darüber hinaus. Ich weiß, dass das was mit clear:both zu tun hat, aber ich weiß nicht wo ich das hingeben soll:

http://testseiten.te.ohost.de/example2.html

CSS:

.form_content {
padding:15px 0;
}

.ergebnis_box {
width:100%;
padding:15px 0;
}

.ergebnis_box h2 {
color:#FFFFFF;
background:#474d55;
padding:11px 14px;
text-align:left;
}

.ergebnis_box .cnt {
width:auto;
background:#e6e6e6;
padding:24px;
}

.ergebnis_box .cnt img {
float:left;
margin-right:14px;
}

.ergebnis_box .cnt p {

float:left;
}
​
HTML:

<body>
<div class="form_content">
<h2>H1</h2>
<p>Lorem Ipsum<strong></strong></p>

<div class="ergebnis_box">
<h2>h2</h2>


<div class="ergebnis_box cnt">
<div><img src="../images/img1.png" width="271" height="249" alt="img" title="img" /></div>
<div><p>Lorem Ipsum</p>
<p>Lorem Ipsum</p>
</div>

</div>


</div>
</body>​
 
Du bist schon auf der richtigen Fährte, die Floats innerhalb von .ergebnis_box müssen gecleart werden. Das geht, indem du z.B. ein clearendes Element (<div style="clear:both">) als letztes Element der Box einfügst.

Alternativ kannst du auch .ergebnis_box ein "overflow:hidden" geben. Das erzielt die gleiche Wirkung
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben