При вёрстке сайта, одной из первых задач верстальщика является создание основного шаблона. Основным шаблоном в данном случае называется вёрстка без контента - это совокупность шапки сайта, меню, футера и прочих элементов, которые встречаются на каждой странице. Итак, попробуем сверстать простой макет сайта. Сверху у нас будет шапка сайта, слева будет навигация по разделу сайта, справа контент, а снизу футер. Стандартный шаблон, ничего необычного. Начнём с HTML. <div class="main-container"> <header>Header</header> ...

В прошлых уроках мы подробно разбирали блочную модель вертски, как отступать блоки друг от друга, изучали поведение и расположение элементов относительно друг друга. Но как располагать элементы на странице, не влияя на расположение других блоков,  не нарушая семантику документа? Для этого существует позиционирование (position). Это правило может применять 4 значения — relative, absolute, fixed и static. В этом уроке речь пойдет о фиксированном позиционировании (position:fixed) Важно сказать, что применение одного лишь правила position недостаточно...