Jaki jest pożytek z style = "clear: both"?

Question

Zdarzyło mi się zobaczyć div, który miał styl clear:both! Jaki jest pożytek z clear w style?

<div style="clear:both"> 

Answer 1

clear:both powoduje, że element spada poniżej pływających elementów poprzedzających go w dokumencie.

Możesz również użyć clear:left lub clear:right, aby upuścić go poniżej tylko tych elementów, które zostały przesunięte w lewo lub w prawo.

+------------+ +--------------------+ 
|   | |     | 
| float:left | | without clear | 
|   | |     | 
|   | +--------------------+ 
|   | +--------------------+ 
|   | |     | 
|   | | with clear:right | 
|   | | (no effect here, | 
|   | | as there is no | 
|   | | float:right  | 
|   | | element)   | 
|   | |     | 
|   | +--------------------+ 
|   | 
+------------+ 
+---------------------+ 
|      | 
| with clear:left | 
| or clear:both | 
|      | 
+---------------------+ 

Answer 2

Wystarczy dodać do odpowiedzi RichieHindle jest, sprawdź Floatutorial, który poprowadzi Cię przez jak CSS pływających i rozliczeń robót.

Answer 3

Gdy używasz spłaszczenia bez szerokości, pozostało trochę miejsca w tym wierszu. Aby zablokować tę przestrzeń, możesz użyć clear:both; w następnym elemencie.