1.先說display,float,position的關系
display如果為none，float和position都失效；
display不為空的時候，如果position為absolute或者為fixed的時候，並且float的值不為空，則float失效；如果position為relative的時候，float的值如果不為空，則float生效。
2.display的值有很多種，block,table,table-row,table-cell,inline,inline-block，list-item。這次先說一下display=table以及display:list-item的情況。
舉個例子：
<div id="aas">

<div id="main">
<div id="nav">navConetent</div>
<div id="extras">extraContent</div>
<div id="content">contentcontent</div>
</div>
</div>

#aas {
display: table;
border-spacing: 10px;
border-collapse: collapse;
}

#main {
display: table-row;
}
#nav {
display: table-cell;
width: 180px;
background-color: #e7dbcd;
}

#extras {
display: table-cell;
width: 180px;
background-color: #d7ad7b;
}

#content {
display: table-cell;
width: 180px;
background-color: yellow;
}
效果如下：
這樣設置就可以表示成像table的樣子啦。
總結如下：
display
table ===> 按照table樣式渲染。

給一個元素兩個屬性，就能讓這些元素按照列表排列。這兩個屬性是：

1、display:list-item

2、list-style-type:decimal(屬性值很多種類)；

display,float,position的關系以及display=table,table-row,table-cell等屬性的使用