Clearfix自动删除边距0？答案

【问题标题】：Clearfix removing margin 0 auto?Clearfix自动删除边距0？
【发布时间】：2012-12-15 22:04:07
【问题描述】：

在使用 clearfix 时遇到问题...在使用时，它将删除我的 div 居中（margin 0 auto）。因此，以此为例，“容器”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%;
}

【问题讨论】：

标签： css css-float clearfix

【解决方案1】：

我刚遇到这个问题。要清除margin: 0 auto;，您可以使用margin-left: 0;

【讨论】：

【解决方案2】：

真的不需要像这样使用“clearfix”。你只需要提醒container它是一个包含元素，通过添加这个CSS规则很容易实现：

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

然后您可以安全地删除“clearfix”div，因为它不是必需的。

【讨论】：