拆分表格单元格以添加更多列和行

Question

我正在尝试构建此布局：

我现在有这个：http://jsfiddle.net/Gh6mB/12/

问题是div #detalhes不占用水平上的所有可用空间。此div必须分为左侧部分（图像）和右侧，以显示其他信息。我已经将div的stype更改为table-cell，table-row和table但是它没有用。 您可以在全屏结果中看到这一点：http://jsfiddle.net/Gh6mB/12/embedded/result/

Answer 1

让它工作http://jsfiddle.net/Gh6mB/21/

将此添加到您的div #detalhes

display:block; float:left; width:100%;

并删除了此

position:relative;

Answer 2

当你使用div和浮动你还必须考虑调整页面大小的动作，另一种选择......

简单的解决方案，使用表格。

<table width="100%"><tr><td width="90%" colspan="2"></td><td width="10%"></tr><tr><td width="10%"></td><td width="80%"></td><td width="10%"></tr></table>

colspan将占用第一列的2行，使用css作为图像等