为什么有些div适合整个宽度有些不是？

Question

这是jsfiddle：http://jsfiddle.net/thisisblake/DUALJ/

我的问题是：为什么column2适合父div的整个宽度，而column1不适合？{/ p>

Answer 1

这是由于css上的这一行：

#main {
  width: 480px; // This one
}

如果删除该宽度，它将适合整个列。

Answer 2

它与width: 480px;有关如果您要将该行更改为width: 100%;，它将填充容器的整个宽度。

在：

#main {
    /*  float:right;*/
    width:480px;
    padding:10px;
    background:#9c9;
}

后：

#main {
    /*  float:right;*/
    width:100%;
    padding:10px;
    background:#9c9;
}

Answer 3

为main指定了480 px的宽度，因此它将被限制为宽度。 以下是删除该行的代码：http://jsfiddle.net/DUALJ/1/

#main {
/*  float:right;*/
    padding:10px;
    background:#9c9;
}