html - 如何使用边框分隔表格中的行

Question

我有一个表格，我必须在其中使用边框分隔一行，如下图所示。

如您所见，边框分隔符在左右两侧有一个空格，并且没有完全接触到表格边框。

我尝试提供填充、边距但没有任何效果。

tr {
    border-bottom: 1px solid blue;
    padding: 10px; // not working
    margin: 10px; // not working
}

https://jsfiddle.net/alpeshprajapati/s934Lpbx/

实现这个的方法是什么？

Answer 1

CSS

table {
  border: 1px solid black;
  border-collapse: collapse;
}
thead {
    background: black;
    color: white;
}
th {
    width: 100px;
}
tr {
    float: left;
    border-bottom: 1px solid blue;
    width: 90%;
    margin: 0 10px;
}
td{
  width: 32%;
  float: left;
}