0

clearfix に問題があります...使用すると、div のセンタリング (マージン 0 自動) が削除されます。したがって、これを例として使用すると、「コンテナ」div は「ヘッダー」内で中央に配置されるのではなく、左にフロートされます。「一部のコンテンツ」は、高さが定義されていないフローティング アイテムです。この時点で使用できるのは clear = display: block; のみです。クリア: 両方; 高さ: 0; 幅:100%; 最後に div でそれらを正しくクリアします。

何が問題ですか？

例 ：

<div id="header">
    <div class="container">
        <div>
            <p>some content</p>
        </div>
        <div>
            <p>some content</p>
        </div>
                          ****<div class="clear"></div>
    </div>
</div>


#header {width: 100%; margin: 0; padding: 0; clear:both;}

.container { clear:both; width: 960px; margin: 0 auto; padding: 0;}

.clearfix:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}

.clearfix {
display: inline-block;
}

html[xmlns] .clearfix {
display: block;
}

* html .clearfix {
height: 1%;
}
4

2 に答える 2

2

私はちょうどこの問題を抱えていました。クリアmargin: 0 auto;するには、単に使用できますmargin-left: 0;

于 2015-06-29T17:01:49.437 に答える
0

このような「clearfix」を使用する必要はありません。containerこれは、次の CSS ルールを追加することで簡単に実現できる包含要素であることを思い出してください。

.container {
    overflow:auto;
    zoom:1; /* fix for older IE versions */
}

その後、「clearfix」divは必要ないため、安全に削除できます。

于 2013-01-01T05:32:13.040 に答える