Jak korzystać z klasy .clearfix?

Question

Myślę, że nie rozumiem pojęcia klasy .clearfix. Może ktoś może mi pomóc.

Szukam sposobu użycia float i clear bez zepsucia mojego znacznika. Pomyślałem więc, że tam można użyć .clearfix.

Wewnątrz pustej H5BP projekcie, mój znaczników wygląda następująco:

<div></div> 
    <div></div> 
    <div class="clearfix"></div> 
    <div></div> 
    <div></div> 
    <div class="clearfix"></div> 
    <div></div> 
    <div></div> 
    <div class="clearfix"></div> 

Poniżej wynik. Spodziewałem się jednak tic tac-toe-field. Czy ktoś mógłby mi powiedzieć:

1. Jak mogę osiągnąć mój cel i
2. Co klasa .clearfix naprawdę mogą być używane?

Answer 1

Klasa jest używana na kontenerze, którego wszystkie dzieci unoszą się. Jeśli nie używałbyś tego, pojemnik nie uzyskałby żadnej wysokości (z wyjątkiem IE). http://complexspiral.com/publications/containing-floats/

To, czego szukasz, nie jest clearfix, ale tylko clear. Można teraz wykonać klasę i zastosować tę zamiast używanej teraz wartości .

Jeśli chcesz dowiedzieć się więcej o clearfix, jest mnóstwo informacji tam:
What is a clearfix?

mam założyć mały przykład wykazać stosowanie clearfix i clear: http://jsfiddle.net/hjXMG/1

Answer 2

Musisz zadeklarować clearfix, więc w tagu (lub w pliku CSS) używać:

<style type="text/css"> 
    .clearfix { 
     clear: both; 
    } 
</style> 

Co robi, jeśli masz pływak i wstawić usuń po nim następny element.

Answer 3

• Clearfix został dodany wokół pływających bloków
• Wyczyść dodaje po pływających bloków