div构建table

1、Css display值与解释-（详细可见CSS手册的CSS display手册）参数：
block :块对象的默认值。用该值为对象之后添加新行
none :隐藏对象。与visibility属性的hidden值不同，其不为被隐藏的对象保留其物理空间
inline :内联对象的默认值。用该值将从对象中删除行
compact :分配对象为块对象或基于内容之上的内联对象
marker :指定内容在容器对象之前或之后。要使用此参数，对象必须和:after及:before 伪元素一起使用
inline-table :将表格显示为无前后换行的内联对象或内联容器
list-item :将块对象指定为列表项目。并可以添加可选项目标志
run-in :分配对象为块对象或基于内容之上的内联对象
table :将对象作为块元素级的表格显示
table-caption :将对象作为表格标题显示
table-cell :将对象作为表格单元格显示
table-column :将对象作为表格列显示
table-column-group :将对象作为表格列组显示
table-header-group :将对象作为表格标题组显示
table-footer-group :将对象作为表格脚注组显示
table-row :将对象作为表格行显示
table-row-group :将对象作为表格行组显示

2、代码段如下

#main
{


display
: table
;


border-collapse
:
collapse
;


}




#nav
{


display
:
table-cell
;


width
:
180px
;


background-color
:
#e7dbcd
;


}




#extras
{


display
:
table-cell
;


width
:
180px
;


padding-left
:
10px
;


border-right
:
1px
dotted
#d7ad7b
;


}




#content
{


display
:
table-cell
;


width
:
380px
;


padding-left
:
10px
;


}

<div id="wrapper">

 
<div id="main">

   
<div id="nav"> navigation column content…
</div>

   
<div id="extras"> news headlines column content…
</div>

   
<div id="content">main article content…
</div>

 
</div>


</div>