• Теория
  • Теория

Раскладка простой страницы: боковая колонка

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

В разметке элемент .sidebar находится почти в самом конце, перед подвалом, но с помощью гридов мы можем запросто переместить его в любое место на странице, ничего при этом не меняя в разметке. Ещё одна прекрасная особенность гридов!

Поместим его справа от промоблока, он будет занимать весь третий столбец и два ряда: второй и следующий за ним.

Примечательно, что элемент начинается на фиксированном по высоте втором ряду и продолжается на третьем ряду, у которого высота автоматическая. Почему так, ведь в нашем элементе есть текст?

Дело в том, что всё-таки допустимо делать фиксированную высоту ряда, даже если в нём есть блоки с текстовым содержимым. Но нужно обязательно убедиться, что такие блоки расположены, помимо грид-ячеек с фиксированной высотой, ещё и в грид-ячейках с автоматической высотой, чтобы оставалась возможность увеличения размера текстов.

Минимальный вид табов
  • index.html
HTML
HTML

Вы перешли на другую страницу

Кликните внутри мини-браузера, чтобы поставить фокус в это окно.

100%
Бабушка Кекс

Притормози, дружище

Проходить вызовы части «Знакомство с гридами» тренажёра «Погружение в техники раскладок» можно после регистрации и оформления подписки.