如何摆脱边界相交的空白?

时间:2018-10-23 21:48:31

标签: html css

我有一张由div制成的桌子,在一些水平和垂直边框重叠的单元格上有边框。如果边框的颜色不同(在这种情况下为黑色和透明),则边框重叠处会有一个很小的间隙。有办法摆脱这种差距吗?我只想让黑色边框优先于透明边框。

.container {
  width: 400px;
  height: 400px;
  display: flex;
  flex-flow: wrap;
}

.section {
  flex: 40%;
}

.bot {
  border-top: 4px solid transparent;
}

.right {
  border-left: 4px solid black;
}
<div class="container">
  <div class="top left section"></div>
  <div class="top right section"></div>
  <div class="bot left section"></div>
  <div class="bot right section"></div>
  <div class="bot left section"></div>
  <div class="bot right section"></div>
</div>

JSFiddle:https://jsfiddle.net/twshzrdm/

0 个答案:

没有答案