【コーディング備忘録】「display:inline-block」でリストを横並びにした時に生じる余白の対処法

グローバルナビなどリストを横並びにする時に発生してしまう余白について書き記しておこうと思います。

先日、リストタグに対して「display:inline-block」を使って要素を横並びにした時に、liとliの間に謎の余白が発生している事に気がつきました。

この余白について先輩に相談してみたところ、リストに「display:inline-block」を使うと横並びするのに付随して発生するものだという事が判明。この余白の解消方法も学んだので、簡単にまとめてみます。