Порядок блоков при изменении ширины — различия между версиями
Coder (обсуждение | вклад) |
Coder (обсуждение | вклад) (→Правый блок помещается НАД левым) |
||
| Строка 1: | Строка 1: | ||
| − | |||
<style> | <style> | ||
.right_block { | .right_block { | ||
| Строка 12: | Строка 11: | ||
} | } | ||
</style> | </style> | ||
| + | |||
| + | |||
| + | |||
| + | == Правый блок помещается НАД левым == | ||
<div style="float:right; width: 29%; min-width: 300px; max-width: 500px; background-color:#d19a04; margin: 10px;">ПРАВЫЙ БЛОК: Перечень порталов, ссылки на популярные статьи | <div style="float:right; width: 29%; min-width: 300px; max-width: 500px; background-color:#d19a04; margin: 10px;">ПРАВЫЙ БЛОК: Перечень порталов, ссылки на популярные статьи | ||
| Строка 20: | Строка 23: | ||
| ЛЕВЫЙ БЛОК: избранные статьи, изображения. В таблице, где много данных. В ширину данные могут занимать всю ширину окна, поэтому ширину блока таблицы необходимо контролировать. | | ЛЕВЫЙ БЛОК: избранные статьи, изображения. В таблице, где много данных. В ширину данные могут занимать всю ширину окна, поэтому ширину блока таблицы необходимо контролировать. | ||
|} | |} | ||
| − | |||
== Правый блок помещается ПОД левым == | == Правый блок помещается ПОД левым == | ||
Версия 12:51, 19 июня 2017
<style>
.right_block {
width:29%;
}
@media screen and (max-width: 1300px) {
.right_block {
width:100%;
}
} </style>
Правый блок помещается НАД левым
ПРАВЫЙ БЛОК: Перечень порталов, ссылки на популярные статьи
| ЛЕВЫЙ БЛОК: избранные статьи, изображения. В таблице, где много данных. В ширину данные могут занимать всю ширину окна, поэтому ширину блока таблицы необходимо контролировать. |
Правый блок помещается ПОД левым
ВЕРХНИЙ БЛОК (шапка): название страницы, приветствие, статистика
ПРАВЫЙ БЛОК: Перечень порталов, ссылки на популярные статьи
|
НИЖНИЙ БЛОК (подвал): контакты, важные ссылки
