【CSS】ul（li）の長さを要素中の最大文字数に合わせる方法

2018/2/26 スタイルシート(CSS)

通常ul（li）を利用した場合、行が横幅いっぱいになりますが、親要素に"display:inline-block"を指定することで liの最大文字数に合わせた横幅にすることが出来ます。

</div>親要素に「display:inline-block」を指定</div>
<div style="display:inline-block;">
	<ul style="background-color:#ccc;">
		<li>aaaaaaaa</li>
		<li>bbb</li>
	</ul>
</div>
<div>親要素に何も指定しない場合</div>
<ul style="background-color:#ccc;">
	<li>aaaaaaaa</li>
	<li>bbb</li>
</ul>