2012-04-07 4 views
0

Ich habe eine Regel wie folgt aus:CSS: Körper Grenze wird nicht erweitert, wie Mitteldiv tut?

body{border:1px solid gray;} 

#middle{ 
float:left; 
margin-left:3%; 
margin-top:20px; 
width:41%; 
border-top:solid #aaaaaa 1px; 
} 

.message-content{ 
padding:0 10px 0 10px; 
float:left; 
} 

Mein HTML ist wie:

<html> 
<body> 
<div id="middle"> 
    <div class="message-content">Loris ipsidum</div> 
    <div class="message-content">Loris ipsidum</div> 
<div id="clear"></div> 
</div> 
</body> 
</html> 

Ich versuchte es in JSFiddle zu duplizieren, aber ich war nicht in der Lage. Was passiert ist, nachdem ich viele Nachrichten-Content-Divs bekommen habe, wird der durch die body-Regel definierte Rahmen übergeben. Es sieht im Grunde aus, als gäbe es eine Linie mitten durch den Inhalt. Irgendwelche Ideen?

Ich werde versuchen, ein funktionierendes Beispiel zu bekommen.

+0

Was ist auch seltsam ist, dass ich PHP verwende, um Inhalt in die "Nachricht-Inhalt" div zu laden, und der Inhalt erscheint nicht im Quellcode, so dass es schwierig, neu zu erstellen. –

Antwort

0

Da Ihre #middle Elemente schweben, zählen sie nicht in der Höhe des übergeordneten Elements (in diesem Fall des Körpers), sodass der Körper nur die Höhe des Fensters einnimmt.

Sie haben anscheinend keinen clear Stil für Ihr #clear Element definiert. Trotzdem sollte das clear Element nach sein, nicht im Inneren, das schwebende Element.

+0

Danke. Gibt es eine Möglichkeit, die Höhen von schwebenden Elementen zu berücksichtigen? –

+0

Am Ende sollte es sauber gemacht werden. –

+0

Die Grenze hat sich leider nicht vergrößert. Ich habe die Grenze weggenommen, die ist besser .... –