Редактирование сетки с помощью CSS

[attol]

Добрый день!

Коллеги, подкиньте идею. Во вложении - картинка, думаю, все сразу ясно.
Итак, есть сетка из 3-х ячеек, на десктопе они расположены слева направо: меню - контент - сайдбар.
На мобильных надо, чтобы расположение было такое (сверху вниз по вертикали):
- контент
- сайдбар
- меню

Причем, из соображений SEO надо, чтобы в коде <div> с контентом был выше <div> меню и сайдбара.
Пытаюсь найти решение средствами CSS.

Спасибо за любые идеи.

[spoon]

В сетке ставь точку адаптации и все ок.

[attol]

Да, спасибо, забыл про это написать.Точки останова использовать нежелательно, т.к. в контент надо будет вставлять мастер-объекты, а они на точках останова будут выходить криво.

[spoon]

Ну дак то мешает скрывать объекты и добавлять новые на точках. Не понятно, что вы хотите конкретно: сделать адаптацию сетки на точках или сделать адаптивным мастер-объекты?

[attol]

Скрывать и добавлять объекты на точках - для меня это неудобно. Я хочу взять за основу стандартные сетки и немного дописать CSS.

Пока получилось вот так: http://advport.ru/7/page.html - к стандартным сеткам дописан код (см.ниже).
Но в коде страницы видно, что МЕНЮ идет выше КОНТЕНТА, надо поменять их местами. И желательно скрыть МЕНЮ на разрешении ниже 779.

------------
Дописан код:
<style>
@media (min-width: 780px) and (max-width: 1024px) {
#indexLayoutGrid1 > .row > .col-1 {
width: 25%;
float: left;
}
#indexLayoutGrid1 > .row > .col-2 {
width: 75%;
float: left;
}
#indexLayoutGrid1 > .row > .col-3 {
width: 100%;
}
}

@media screen and (max-width: 779px) {
#indexLayoutGrid1 > .row > .col-1 {
display: table-footer-group;
}
#indexLayoutGrid1 > .row > .col-2 {
display: table-footer-group;
}
#indexLayoutGrid1 > .row > .col-3 {
display: table-cell;
}
#indexLayoutGrid1 .row {
margin: auto;
}
}
</style>

[spoon]

т.е. скрывать меню на точках для вас удобно, а объекты не удобно)) Вы изобретаете велосипед походу дела.
Значит меню у вас расположено в билдере ниже чем все остальные блоки.

[attol]

Просто левое меню не нужно на мобильных.

[attol]

К тому же, скрывать объекты и добавлять новые - это что, дублировать, напр., статью в 1,5 тыс. знаков?

[spoon]

Текст адаптивный, его скрывать не надо, сейчас вроде проблем нет с адаптивными объектами, всё можно сделать если правильно выставлять точки.

[anonimus]

да и раньше проблем особо не было

[Vitamin701]

Сейчас не знаю как с объектами , но в моей версии проблемы с объектами бывают. Не так давно писал пост, о том что картинки слишком уменьшаются. Кстати так и не решил пока.