欧美一区二区三区,国内熟女精品熟女A片视频小说,日本av网,小鲜肉男男GAY做受XXX网站

HTML / CSS:列之間的邊框

CSS

我試圖用Flexbox創(chuàng)建一個(gè)列布局，并希望在每個(gè)列之間有垂直的全高邊框。

這是我正在嘗試制作的東西——邊框圖像

.testing {
  display: flex;
  flex-direction: row;
  padding: 10%;
  flex-wrap: wrap;
  background-color: red;
  height: 20%;
}

.testing > div {
  width: 100px;
  background-color: green;
  margin: 10px;
  padding: 10px;
  text-align: center;
}

<div class="testing">
  <div class="col">
    00
  </div>
  <div class="col">
    00
  </div>
  <div class="col">
    00
  </div>
  <div class="col">
    00
  </div>
  <div class="col">
    00
  </div>
  <div class="col">
    00
  </div>
  <div class="col">
    00
  </div>
  <div class="col">
    00
  </div>
  <div class="col">
    00
  </div>
  <div class="col">
    00
  </div>
</div>

擺弄gap屬性。

.testing {
  display: flex;
  flex-direction: row;
  padding: 10%;
  flex-wrap: wrap;
  /* background-color: red; */
  height: 20%;
  gap: 1px;
}

.testing > div {
  width: 100px;
  background-color: green;
  /* margin: 10px; */
  padding: 10px;
  text-align: center;
  border: 10px solid red;
}

<div class="testing">
  <div class="col">
    00
  </div>
  <div class="col">
    00
  </div>
  <div class="col">
    00
  </div>
  <div class="col">
    00
  </div>
  <div class="col">
    00
  </div>
  <div class="col">
    00
  </div>
  <div class="col">
    00
  </div>
  <div class="col">
    00
  </div>
  <div class="col">
    00
  </div>
  <div class="col">
    00
  </div>
</div>