インラインブロック要素【inline-block】

概要

インラインブロック要素（inline-block）とは、CSSに用意された要素の配置方式の一つで、インライン要素とブロックレベル要素の両方の性質を併せ持つもの。display プロパティを「inline-block」に指定することで利用できる。

HTMLおよびCSSにはもともと、文章の一部など断片的な要素を表す「インライン要素」（inline element）と、段落やテーブルなど単体で意味のあるまとまりを構成する「ブロックレベル要素」（block-level element）の区別があった（HTMLにおける区別はHTML5で廃止）。

インラインブロック要素はブロックレベル要素をインライン配置したような特徴を持つ。ブロックレベル要素のように幅や高さ、マージン、パティングを指定できるが、インライン要素のように横幅の初期値が内容に応じて決まり、直前の要素に対して改行されず横並びとなる（右端に収まらない場合は次行の先頭に送られる）。

HTML要素の中にデフォルトでインラインブロック要素となっているものは無く、CSSのdisplay プロパティで指定しなければならない。分類タグの一覧表示のように、縦幅は揃っているが横幅がラベル次第で決まる要素を空間内に敷き詰めるように配置したい場合に便利である。

(2023.4.27更新)

この記事の著者： (株)インセプト IT用語辞典 e-Words 編集部
1997年8月より「IT用語辞典 e-Words」を執筆・編集しています。累計公開記事数は1万ページ以上、累計サイト訪問者数は1億人以上です。学術論文や官公庁の資料などへも多数の記事が引用・参照されています。