我只是試圖讓我的錶行去跨表中的所有方法，但它僅在左側填充約20％。獲取錶行跨越整個寬度
<table id="t1" style="width:25%; height:50%">
<tr id="tr1">
<td id="user1"></td>
<td id="champ1"></td>
<td id="wr1"></td>
</tr>
</table>
我在後面的腳本中的數據單元中的值。 這是CSS。
#t1 {
margin-left: auto;
margin-right: auto;
display: inline-block;
}
tr {
width: 100%;
align-content: center;
}
在您的代碼中，您不需要關閉<td>'s，而是每個都在關閉</tr>中終止。如果在<td>沒有內容，添加
錶行（<tr>）將默認爲表的100％，如果除去display: inline-block，並正確終止它們。把它們包裹起來，讓它們浮起來。這使您有機會爲表格添加標題或添加控件。
我建議的HTML：
<div class="wrapper">
<div class="left">
<table id="table1">
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
</div>
<div class="right">
<table id="table2">
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
</div>
</div>
CSS：
的所有代碼/* Optionally throw in a media query, so the floats only happen if there is enough room for the two tables next to each other, but seamlessly fall under each other if not -- @media screen and (min-width: 600px){*/
.left{float:left; width:50%;}
.right{float:right; width:50%;}
/* } Optionally, close the media query here. */
/* Keep the wrapper open until both tables are done*/
.wrapper:after{clear:both;}
table{}
/* Add margin if the tables get to close, or negative margin if you want them closer*/
從＃t1樣式中刪除display: inline-block。
這也將導致表，因爲汽車利潤的中心，所以如果你想表左對齊刪除這些。
例的jsfiddle：http://jsfiddle.net/Lrog2pgm/
您的標記是一個爛攤子......
首先，你正在關閉<td>與</tr>。
我不知道什麼是align-content: center;？我想你的意思是text-align: center;。
你正在共享一個#id 2選擇器（ID = 'TR1'）。不允許。
先嚐試修復了一些這些東西。
問題有ID tr1和t1。他們不是重複的。另外，看看align-content：http://www.w3schools.com/cssref/playit.asp?filename=playcss_align-content&preval=center –
哦......我的不好。我現在看到了。可能要重新考慮你的命名約定，然後......這是非常模糊的，而且顯然很容易被誤解。此外，你真的應該使用類而不是ID。更好的重用性和擴展性。 –
首先是一個爛攤子。它有不匹配的標籤，並且只是混雜在一起。其次，不要再次使用表格。它們幾乎被棄用。這些日子你可以用列表完成你所做的一切。表甚至沒有響應。就像你發現的那樣，它們很有氣質。我的回答：使用<ul>
表格還活着。它們不打算用於佈局目的，但對錶格數據非常有效：http://www.w3.org/TR/html5/tabular-data.html。這個問題並沒有說明表格的用途，所以它可能是語義上正確的標記。 –
爲什麼你元素與關閉？ –
糟糕，修正了這個問題。 – ghadams