Wie mache ich ein HTML-div-gehen unter einem anderen div?

<html>
<body>
<div id="content1">
    <div id="text1">This text floats left</div>
    <div id="images1"><img src="img.jpg" /></div> <!--Floats right-->
</div>
<div id="content2">Text 2</div>
</body>
</html>

Wenn ich versuche, dies zu tun, und versuchen, ein layout wie eine Tabelle mit zwei Zeilen mit dem text " schwebend nach Links und das Bild floating rechts in der ersten Reihe, alle, die kommt, ist, dass die content2-div gequetscht in der inhalt1-div. Wie kann ich diese trennen?

InformationsquelleAutor der Frage DarkLightA | 2011-06-07

  1. 18

    Müssen Sie clear:both; #content2 div

    Wenn Sie wirklich wollen, lernen Sie alles über schwimmt, check out diese erstaunliche tutorial: http://css.maxdesign.com.au/floatutorial/

    InformationsquelleAutor der Antwort Dave Kiss

  2. 2

    Verwenden clear:both; auf Ihren Inhalt#2

    InformationsquelleAutor der Antwort Javascript is GOD

  3. 1

    Gelten:

    #images1{
 float:right;   
}

#content2{
 clear:both;   
}

    und fixieren Sie Ihre html-markup

    <div id="images1"><img src="img.jpg" /> <!--Floats right-->

    schließen Sie das div:

    <div id="images1"><img src="img.jpg" /> <!--Floats right--></div>

    InformationsquelleAutor der Antwort Niklas

  4. 0

    Sie vergessen haben, schließen Sie Ihre <div id="images1"> 🙂

    InformationsquelleAutor der Antwort solendil

  5. 0

    verwenden Sie 'clear:both' auf content2 div

    InformationsquelleAutor der Antwort Rizwan Sharif

  6. 0

    Ich hoffe, dass Sie müssen hinzufügen, ein weiteres div, bevor <div id="content2">Text 2</div> werden <div style="clear:both;"></div>

    InformationsquelleAutor der Antwort sudipto

  7. 0

    klar, Ihr schwebt.
    Hier ist ein Artikel, die beschreiben, was Los ist: Clearing A Float Element

    InformationsquelleAutor der Antwort BentOnCoding

  8. 0

    Haben Sie nicht verschlossen <div id="images1">. Wenn das div geschlossen ist und die Content-divs arenot float left dann sollte es funktionieren.

    InformationsquelleAutor der Antwort Vinnyq12

  9. 0

    overflow:hidden auf Ihre inhalt1 div wird es erweitern, um umfassen alle schwammen Kinder. (Natürlich verstecken sich nicht-schwebte überquellenden Inhalt.)

    InformationsquelleAutor der Antwort Tgr

Schreibe einen Kommentar