如何使表格边框适用于所有浏览器？

Posted 2023-03-05

【中文标题】如何使表格边框适用于所有浏览器？

【英文标题】：How can I make a table border work on all browsers?

【发布时间】：2020-08-27 16:00:48

【问题描述】：

我有一张带边框的桌子。现在，边框适用于 Brave 浏览器。在 Chrome 和 Safari 上，边框延伸得太远。如果我把它变小，边框在<td> 之前结束。有没有办法让它和<td>一样长？抱歉，如果这真的很明显，我对此很陌生，无法在网上找到任何信息。现在我有：

/* not much to show but this is what happens in Chrome/Safari */
table 
  display: block;
  text-align: center;
  font-family: ‘Jost’, sans-serif;
  border: 7px solid red;
  border-radius: 13px;
  width: auto;
  margin-right: 8%;
  margin-left: 8%;
  border-spacing: 3px;

td 
  background-color: yellow

<table>
  <tr>
    <td>text</td>
    <td>text</td>
    <td>text</td>
    <td>text</td>
    <td>text</td>
  </tr>
</table>

【问题讨论】：

移除显示：块

【参考方案1】：

从 W3 开始： Block - 将元素显示为块元素（如

)。它从新行开始，占据整个宽度。

移除显示类型：https://www.w3schools.com/cs-s-ref/pr_class_display.asp