请教一个和 border 有关的 CSS 样式的问题

[LandCruiser]

123456789 等等一些数字横向排列，每个数字在一个 div 中，会随机（不确定数量，也不确定是哪个数字）赋予某个 div 一个四面的边框，如何解决诸如，1 和 2 两个 div 都有边框时的边框叠加变粗问题呢？写一个方法专门计算哪个 border 有哪个 border 没有也太复杂了。或者改变实现方式？不使用 div 来包裹数字？有没有简单一些的办法呢

[Mikawa]

用 box-shadow 代替 border 试试

[noe132]

很简单给有边框的元素一个 class
然后写
.has-border + .has-border
border-left: none;

[LandCruiser]

@Mikawa 感觉是一样的，主要我这个问题是不固定哪个数字有边框，是动态的

[lupkcd]

margin-left: -1px

[LandCruiser]

@noe132 这个方法可以了，都忘记有 + 这个东西了

[ashong]

.number {
border: solid 1px grey;
}
.number:not(:last-of-type){
border-right: none;
}

[Mikawa]

@LandCruiser #3 因为 box shadow 不占文档流，如果是实色边框的话，这么搞就不用纠结了🤣，平时经常拿 box-shadow 来模拟边框、outline ，尤其是 a11y 里的

[qzhai]

用伪元素 before 或 after
显示数字的盒子不要加 border 并设置相对定位。
设置其 before 绝对定位 宽高 100%，上下左右都是零 ，设置 box-sizing 默认 然后加 border ， 最好不要在这里这 bordercolor ，在 active 后加上颜色。
这样相近的边框会重叠。