襯裏填滿浮子而不是表？

我明白花車如何能夠定位彼此相鄰元素和基本收縮到合適有用，但如何將一個去實現一個表樣外觀襯裏填滿浮子而不是表？

Column 1  |  Column 2  |  Column 3 
Column 4 Bigger |  Column 5  |  Column 6

注意到的第一組列如何調整到適合最大元素的長度？所以如果第4列比1寬，1會自動變寬？到目前爲止，我能做到這一點的唯一方法是使用display：table和display：table-cell，但它有點片狀，因爲我必須設置特定的寬度等。除非我做錯了什麼，否則表格可能是最好的方式做這種事......在一個沒有表格的網絡中。

來源

2012-11-18 ryandlf

這取決於你是否有表格數據放入表中或不。 –

沒有「無表」網頁。表格有一個目的：標記表格數據。如果你的數據不是表格，它不應該在表格標籤中 - 使用'display：table'等是你唯一適當的選擇。 – cimmanon

我認爲不使用'display：table'是不可能的，但你可以使用簡單的'Jquery'來實現這一點。 –

希望這回答你的問題:)：

<style> 
.clear{ 
clear:both; 
} 

.column { 
float:left; 
height :20px; 
width: auto ; 
margin:5px; 
display :block; 
} 
</style> 


<div id = "Column 1 " class="column"> 
cell 1 
<div class="clear"></div> 
cell 4 Bigger 
<div class="clear"></div> 
cell 7 
</div> 

<div id = "Column 2 " class="column"> 
Cell 2 
<div class="clear"></div> 
Cell 5 
<div class="clear"></div> 
Cell 8 
</div> 

<div id = "Column 3 " class="column"> 
Cell 3 
<div class="clear"></div> 
Cell 6 
<div class="clear"></div> 
Cell 9 
</div>

編輯添加邊框也將是簡單的。你可以得到那個URL： http://www.bernzilla.com/design/tables/table.html

來源

2012-11-18 04:59:22 bleuscyther

+1鏈接...有趣... –

單獨使用浮動功能將無法使列1的寬度取決於列4的寬度較大（即，因爲列4的寬度越來越寬，所以它變寬）。

相反，您可能喜歡以包圍第1列和第4列寬的浮動容器內，然後從列1除去漂浮& 4.同樣，做同樣的2 & 5，和3 & 6.

來源

2012-11-18 04:53:25 oksushi

襯裏填滿浮子而不是表？

回答

相關問題