Раздельная навигация
Навигационный паттерн, в котором один или более элементов отделены от остальных элементов навигации.
Требования
Распространённый навигационный шаблон имеет один элемент, который отделен от остальных. Мы можем использовать Flexbox для того, чтобы сделать это, без необходимости создавать два набора элементов в двух раздельных flex контейнерах.
Рецепт
Примечание: Download this example
Choices made
Этот паттерн объединяет margin со значением auto и Flexbox для разделения элементов.
Auto margin поглощает все доступное пространство в указанном направлении. Так же работает центрирование блока с автоматическими margin - вы имеете отступы на каждой стороне блока, пытающиеся занять все доступное пространство, таким образом толкая блок в центр.
В этом случаи левый auto margin занимает любое доступное пространство и толкает элемент к правому краю. Вы могли применить класс push к любому элементу в списке.
Совместимость с браузерами
The various layout methods have different browser support. See the charts below for details on basic support for the properties used.