css にて inline-block の謎の余白を取り除く方法

<ul>
	<li>a</li>
	<li>b</li>
	<li>c</li>
	<li>d</li>
</ul>

方法1: letter-spacing を使う

ul {
	// 適当にマイナスしておく。値は特に大きくても関係ない。
	letter-spacing: -1em;
	li {
		display: inline-block;
		letter-spacing: normal;
	}
}

方法2: font-size を使う（非推奨）

若干余白が残ることがある。

ul {
	// サイズは 0 にする。
	font-size: 0;
	li {
		display: inline-block;
		font-size: 14px;
	}
}