использование модели Flex-блоков

[nfsworld]

Хотел бы у знатаков поинтересоваться.

Можно ли верстать различные типы сайтов используя при этом только модель Flex-блоков?

При этом не использовать выравнивание элементов c помощью свойства (float)

К примеру шапку сайта на всю ширину главного контейнера, ниже слева реализовать блок где будет находиться

контент, а справа меню для сайта.

И если можно ссылочку на пример реализации данного дела.

Сам лично пытался и никак не получается.

Просто впервые с этим сталкиваюсь.

Хотелось бы получить в итоге что-то вроде этого примера:

Надеюсь на вашу помощь.

[hypnocolor]

В принципе, можно потихоньку начинать пользоваться флексбоксом. Хочется верить, что за ним действительно будущее разметки. Хоть он и слабо сейчас поддерживается, но последние версии браузеров всё активней к этому стремятся.

Посмотрите статью: http://code.tutsplus.com/tutorials/an-introduction-to-css-flexbox--net-25655, там есть примеры, похожие на то, что вам нужно.

Ещё хорошо о флексбоксе рассказал Макеев: http://pepelsbey.net/2013/05/flexbox-gotcha/

Edited March 5, 2014 by hypnocolor

[ryter]

пожалуй самое грустное это http://caniuse.com/#feat=flexbox. а так вполне можно юзать http://bennettfeely.com/flexplorer/  http://www.html5rocks.com/en/tutorials/flexbox/quick/

[Great Rash]

Хочется верить, что за ним действительно будущее разметки.

flex-box - это не будущее разметки. Это инструмент, созданный для строго определенной цели: создание тянущихся меню.

 

А вот это действительно будущее разметки. Инструмент предложен (сюрприз-сюрприз) компанией Microsoft, соответственно реализован только в ИЕ пока. Но стандарт потихоньку допиливается, надеюсь, что он будет реализован в остальных браузерах как можно скорее.

 

По поводу просьбы ТС сверстать как на картинке, то собственно вот (из первых рук).