小编Jas*_*per的帖子

当 td 为position:relative 时，表格边框未正确呈现

当满足以下条件时，我遇到表格边框并不总是正确渲染的问题：

该表包含在一个 div 中overflow-y:scroll
桌子上的边框折叠起来
元素有样式position:relative

据我所知，这种情况仅发生在 Chrome 上（Mac OS 10.11.6 上的版本 54.0.2840.98）。我在 Safari 和 Firefox 上测试过，没有任何问题。

我在 JSFiddle 中管理了一个最小的案例（https://jsfiddle.net/5a0a4sL1/24/）。代码如下所示：

.scroll {
  background-color:white;
  overflow-y: scroll; 
  width: 300px; 
  height: 200px;
}
.wrapper {
  height: auto; 
  width: 280px; 
  padding: 10px; 
  margin: 0px;
}
table {
  width:90%; 
  margin:0px 5%; 
  border-collapse:collapse;
}
td {
  position:relative;
  border:1px solid black;
}

Run Code Online (Sandbox Code Playgroud)

<div class="scroll">
  <div class="wrapper">
    <table>
      <tbody>
        <tr><td style="height:39px;"></td></tr>
        <tr><td style="height:75px;"></td></tr>
        <tr><td style="height:111px;"></td></tr>
        <tr><td style="height:39px;"></td></tr>
      </tbody>
    </table>
  </div>
</div>

Run Code Online (Sandbox Code Playgroud)

出现问题时页面如下所示：