水平對齊多個表？

我想水平多個表。它在Firefox中工作，但不是鉻。有任何想法嗎？水平對齊多個表？

<!DOCTYPE html> 
<html> 
<head> 
<style> 
body {background-color:#000000;} 
table {border:1px solid #FFFFFF; float:left;} 
tr, td {background-color:#000000; border:1px solid #00000;} 
</style> 
</head> 

<body> 
<table id="t1"> 

<tr> 
    <td><input type="text" /></td> 
    <td></td> 
    <td></td> 
</tr> 
<tr> 
    <td></td> 
    <td></td> 
    <td><input type="text" /></td> 
</tr> 
<tr> 
    <td><input type="text" /></td> 
    <td></td> 
    <td></td> 
</tr> 
    <tr> 
    <td><input type="text" /></td> 
    <td></td> 
    <td></td> 
</tr> 
<tr> 
    <td></td> 
    <td></td> 
    <td><input type="text" /></td> 
</tr> 
<tr> 
    <td><input type="text" /></td> 
    <td></td> 
    <td></td> 
</tr> 

</table> 
<table id="t2"> 

<tr> 
    <td><input type="text" /></td> 
    <td></td> 
    <td></td> 
</tr> 
<tr> 
    <td></td> 
    <td></td> 
    <td><input type="text" /></td> 
</tr> 
<tr> 
     <td><input type="text" /></td> 
     <td></td> 
     <td></td> 
    </tr> 

</table> 
</body> 
</html>

來源

2012-02-23 Ber53rker

我只是cecked在克羅姆，它的正常工作 http://jsfiddle.net/Svbz2/

來源

2012-02-23 23:15:09 Dips

奇怪。也許它被緩存了？ I CTRL + F5'd it ... – Ber53rker 2012-02-23 23:18:32

爲了float屬性的工作，你通常需要指定你想漂浮物體的寬度。試試這個：

<!DOCTYPE html> 
<html> 
<head> 
<style> 
body {background-color:#000000;} 
table {border:1px solid #FFFFFF; width:200px; float:left;} 
tr, td {background-color:#000000; border:1px solid #00000;} 
</style> 
</head> 

<body> 
<table id="t1"> 

<tr> 
    <td><input type="text" /></td> 
    <td></td> 
    <td></td> 
</tr> 
<tr> 
    <td></td> 
    <td></td> 
    <td><input type="text" /></td> 
</tr> 
<tr> 
    <td><input type="text" /></td> 
    <td></td> 
    <td></td> 
</tr> 
    <tr> 
    <td><input type="text" /></td> 
    <td></td> 
    <td></td> 
</tr> 
<tr> 
    <td></td> 
    <td></td> 
    <td><input type="text" /></td> 
</tr> 
<tr> 
    <td><input type="text" /></td> 
    <td></td> 
    <td></td> 
</tr> 

</table> 
<table id="t2"> 

<tr> 
    <td><input type="text" /></td> 
    <td></td> 
    <td></td> 
</tr> 
<tr> 
    <td></td> 
    <td></td> 
    <td><input type="text" /></td> 
</tr> 
<tr> 
     <td><input type="text" /></td> 
     <td></td> 
     <td></td> 
    </tr> 

</table> 
</body> 
</html>

來源

2012-02-23 23:17:34 Zakman411

注意到使用表格作爲佈局結構並不是'語義正確'的方法。似乎你使用它作爲一個Web表單的結構 - 也許考慮使用浮動div來代替？ – Zakman411 2012-02-23 23:21:06

我看不到鉻是不會喜歡這個的。是否有必要使用多個表？也許你應該填寫需要額外的文本，以達到本頁的目的。更好的方法可以是使用DIV（定義頁面上的部分）或UL（無序列表，不帶列表樣式），但不知道是什麼這個頁面正在做。

來源

2012-02-23 23:18:45 Kurt

水平對齊多個表？

回答

相關問題