LoginSignup
15
10

More than 3 years have passed since last update.

@Uuya(Uuya)

線同士の重なりを防ぐ対策

Last updated at Posted at 2019-01-27

リストに枠線をつけたい

リストを1pxの太さの枠線で囲みます。

li{
  border:solid 1px #EEE;
}

上記のコードだけだと枠線が重なり、線の太さが2pxになってしまいます。

スクリーンショット 2019-01-27 17.44.47.png

重なりをなくす

下記のコードの li + li はリストの二つ目以降という意味になります。
つまり二つ目以降は上の枠線を消すということです。

li{
  border:solid 1px #EEE;
}

li + li {
  border-top:none;
}

なくした結果

上記のコードを記述することで線の重なりをなくすことができました
スクリーンショット 2019-01-27 17.59.34.png

最後に

他にもっと良い方法がありましたら教えてください

15
10
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
Sign upLogin
15
10