html - IE认为float initial是float left？

Question

我有以下 html:

<div class="cleanContainer"> 
    <div style="height:80px">test</div>
</div>

还有这个 CSS:

.cleanContainer
{
    float:                      left;
    padding:                    7px;
    background-color:           #ffffff;
    width:                      786px;
    -moz-border-radius:         2px 2px 2px 2px;
    -webkit-border-radius:      2px 2px 2px 2px;
    border-radius:              2px 2px 2px 2px;
}

然后我得到了一个@media screen CSS 文件，我从中得到了这个:

.cleanContainer
{
    float:                      initial;
    padding:                    3px;
    width:                      auto;
}

这在 Chrome 中工作正常， float 设置为无，将占据整个宽度。在 IE 中它将被设置为 float: left 这对设计不利吗？

我该如何解决？

编辑:这是一个示例:http://jsfiddle.net/snowman/ahCga/2/

Answer 1

@Alochi 在 http://www.w3.org/TR/css3-values/#common-keywords 上找到了初始值所以 OP 在 View 中没有错，但这还没有为所有浏览器实现。

所以，

使用 float: none; 而不是 float: initial;

还没有兼容的 float 属性的值。 See here

Description
--------------------------------------------------------------------
Values            |  left   |    right     |     none    |   inherit
--------------------------------------------------------------------
Initial value     |  none  
--------------------------------------------------------------------
Applies to        |  All element
--------------------------------------------------------------------
Inherited         |  No
--------------------------------------------------------------------

值由 w3.org 指定:

左

The element generates a block box that is floated to the left. Content flows on the right side of the box, starting at the top.

右

Similar to 'left', except the box is floated to the right, and content flows on the left side of the box, starting at the top.

无

The box is not floated.

继承

Takes the same specified value as the property for the element's parent.