ナビゲーションの分割

1つ以上の要素が他のナビゲーション項目から分離されているナビゲーションのパターンです。

2つのグループに分けられた項目。

要件

一般的なナビゲーションのパターンは、ある要素を他の要素から押しのけることです。 2セットの項目を2つの別々のフレックスコンテナにする必要なく、フレックスボックスを使用してこれを実現できます。

このパターンは、自動マージンとフレックスボックスを組み合わせて項目を分割します。

自動マージンは、適用される方向に利用可能なすべてのスペースを吸収します。これは、自動マージンを使ってブロックを中央に配置する方法です — ブロックの両側にスペースをすべて取ろうとすると、ブロックが中央に押し込まれます。

この場合、左の自動マージンは利用可能なスペースをすべて占め、項目を右に押します。リスト内の任意の項目にクラス push を適用できます。

BCD tables only load in the browser

さまざまなレイアウト方法が異なるブラウザーサポートを持っています。使用されているプロパティの基本的なサポートの詳細については、以下の表を参照してください。