この内容は古いバージョンです。最新バージョンを表示するには、戻るボタンを押してください。
バージョン:1
ページ更新者:T
更新日時:2018-02-03 13:03:31

タイトル: 「display: flex」を用いて要素を横並びにする方法

floatやらinline-blockやらで要素を横並びにする方法がいくつかあるが、flexを用いると非常に簡単に実装できるのでメモしておく。

HTML

<div class="flex">

<div>要素１</div>

<div>要素２</div>

<div>要素３</div>

</div>

 

CSS

.flex{
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
}