我的CSS技能仍然缺乏,所以提前道歉.我正在使用DataTables jQuery插件处理页面.在我桌子的标题上,我有一个我试图删除的边框样式.
我过分夸大了效果,让我明白我所说的……
这是现在的样子……
这就是我想要的样子……
这是有问题的页面……
https://darkjedi.org/club/FOX/members/mwo_stats.php
我希望它只是一个扁平的黑色垂直线.
编辑：最初我把这误认为是阴影问题,我已经意识到这是一个边界式的问题.
最佳答案
我解决了这个问题：
>删除右边框
>使相对定位
>添加绝对定位的黑色条并使其成为移除边框的宽度(via :: after)
>将绝对定位的黑条固定在单元格的右侧,使其成为边框
>调整排序箭头的背景位置,使它们从右侧细胞壁正确偏移
table.dataTable.compact thead th {
padding-right: 25px;
border-right: none;
position: relative;
}
table.dataTable.compact thead th::after {
content: '';
width: 5px;
height: 100%;
background: black;
position: absolute;
right: 0;
top:0;
}
table.dataTable thead .sorting,table.dataTable thead .sorting_desc,table.dataTable thead .sorting_asc {
background-position: calc(100% - 5px) 50% !important;
}
