CSS3 Reference


box-direction

子要素のレイアウト方向

試す



コード

#containe p {
    display: -webkit-box;
    display: -moz-box;

    box-orient: vertical;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;

    box-direction: normal;
    -webkit-box-direction: normal;
    -moz-box-direction: normal;
}

サンプル

※サポートしていないブラウザでは動作しません。

左のボックス
真ん中のボックス
二列目
右のボックス
左のボックス
真ん中のボックス
二列目
右のボックス

対応ブラウザ

Firefox
Chrome/Safari
3.0~
Opera
まだ
InternetExplorer
まだ

パラメータ

normal | reverse | inherit
初期値normal
適用ボックス要素
継承しない
レベル3
%の解釈-
適用メディアVisual
参考文献Flexible Box Layout Module#3 Display order

解説

子要素のレイアウト方向を指定します。

対象はボックス要素、つまり”display:box”の要素です。

normal
子要素を通常の順で流し込みます。
reverse
子要素を逆順に流し込みます。

コメントする


トラックバック

投稿されたコメント