[CSS] ブロック要素の横幅を要素の内容に沿わせる

テキストの周りにborderを指定する際に有用

毎度忘れてしまうので、メモ。

<p>や<div>といったブロック要素のデフォルトでは横幅が100%になってしまうので display:inline; を指定して中の要素に応じて伸縮するようにする。

ソース

右図の様なスタイル例

HTML

<p id="c_note01">12/13 00:00販売開始</p>

CSS

p#c_note01{
	border:1px solid #336600;
	color:#336600;
	padding:3px 7px;
	display:inline;
	}

Similar posts