当背景颜色存在时,为什么边框不可见"position:sticky"？

在Chrome 56.0.2924.76,只有最后的边界是可见的,而这仅仅是当有一个background-color规定.

这是Chrome中的错误吗？

操场

我遇到了同样的问题.我的解决方法是使用:after伪元素来模拟底部边框.

th:after{
    content:'';
    position:absolute;
    left: 0;
    bottom: 0;
    width:100%;
    border-bottom: 1px solid rgba(0,0,0,0.12);
}

如果表包含列周围的边框,我们添加粘贴位置,当我们滚动表显示重叠效果以删除此效果并保留边框时,我们需要删除边框并添加轮廓而不是边框

table tr th{
      outline: 1px solid #e9ecef;                
      border:none; 
      outline-offset: -1px;
    }

似乎强制回流会部分帮助:

table {
  border-collapse: collapse;
}

thead {
  position: sticky;
  top: 0;
}

th {
  border-right: 5px solid red;
  transform:scale(0.999);
}

  

    

      

        
First
        
Second
        
Third
      
    
  

table tr th {
   position: -webkit-sticky;
   position: sticky;
   top: -1px;
   z-index: 2;
   background-color: white;
   -moz-box-shadow: 0 0 1px -1px #ccc;
   -webkit-box-shadow: 0 0 1px -1px #ccc;
   box-shadow: 0 0 1px -1px #ccc;
}