Question

<table class="schedule">
   <thead>
     <tr>
       <th id="first-column">#</th>
       <th>Monday</th>
       <th>Tuesday</th>
       <th>Wednesday</th>
       <th>Thursday</th>
       <th>Friday</th>
       <th>Saturday</th>
     </tr>
    </thead>
</table>

和

table.schedule { 
  table-layout: fixed;
  width: 900;
}

#first-column {
  width: 200px;
  padding: 0 10px;
}

因为第一列在Firefox中有200 + 10 + 10 = 220px宽度，但在Chrome和Safari中有180 + 10 + 10 = 200px。我认为width不应该包含padding，所以Firefox是对的吗？但无论如何，我如何在浏览器中设置相同的列宽？

修改：Chrome开发者工具如下所示： enter image description here

Answer 1

确保您指定了一个现代doctype，因为我没有看到我所描述的行为。例如，使用<!DOCTYPE html>告诉浏览器它是HTML5。对我来说，第一列是Firefox，Chrome和Safari上的200px +填充。

Chrome和Firefox中的表格列宽不同

1 个答案: