Html 两列div和宽度百分比

我在使用

宽度：100%

时遇到问题，它不会延伸到整个屏幕宽度，但如果我使用像素指定它，它会工作。我不明白它是怎么工作的。我想使用百分比自动调整任何屏幕大小

/*width: 600px; */    /* THIS WILL WORK */
width: 100%;           /*WON'T WORK*/ 

JSFiddle：

CSS:

---

为了使其工作，您需要分配

display:table和<代码>宽度：100%display:table cell，所以将code>设置为父元素

#wrapper{
    height:600px;
    position:relative;
    display: table;
    width: 100%;
}


注意：我没有找到任何合法的理由使用
display:table，因为您可以轻松地使用浮点数实现相同的功能。
为了实现这一功能，您需要指定
display:table和<代码>宽度：100%display:table cell，所以将code>设置为父元素

#wrapper{
    height:600px;
    position:relative;
    display: table;
    width: 100%;
}

display: table-cell;


注意：我没有找到任何合法的理由使用
display:table，因为您可以轻松地使用浮动实现相同的功能

display: table-cell;

问题是，为什么不只使用块类型

问题是，为什么不只使用块类型？
尝试删除
display:table单元格
尝试删除
显示：表格单元格
谢谢。很好，谢谢。工作完美。
#wrapper{
    height:600px;
    position:relative;
    display: table;
    width: 100%;
}