使两个表具有相同的列宽？答案

【问题标题】：Make two tables have same column width?使两个表具有相同的列宽？
【发布时间】：2011-12-21 03:13:59
【问题描述】：

我有两张桌子，每张都有两列。有没有办法让它们的第 0 列宽度相同？：

 // table0
 ---------------------------
 |           | words words |
 | apples    | words words |
 |           | words words |
 ---------------------------

 // table1
 ------------------------------------
 |                    | words words |
 | diamond almonds    | words words |
 |                    | words words |
 ------------------------------------

是的，理想情况下 table0 的第 0 列与 table1 的宽度完全相同。我需要在两个表之间放置一个标签，否则我只会让它们都成为同一张表并完全避免这个问题。比如：

           Centered Title 0
 ------------------------------------
 |                    | words words |
 | apples             | words words |
 |                    | words words |
 ------------------------------------

           Centered Title 1
 ------------------------------------
 |                    | words words |
 | diamond almonds    | words words |
 |                    | words words |
 ------------------------------------

谢谢

【问题讨论】：

标签： html

【解决方案1】：

只需在 <colgroup> 中使用 css

你的桌子

<table border="1">
  <colgroup class="title"></colgroup>
  <colgroup class="description"></colgroup>
  <tr>
    <td>apples </td>
    <td>words words words words words words words</td>     
  </tr>
</table>

CSS

.title{
   width: 100px;   
}   

.description{
    width: 200px;   
}

jsFiddle 示例

【讨论】：