Старый добрый тег <table> — наиболее семантический HTML для отображения табличных данных. Но мне очень сложно контролировать то, как представлена ​​таблица, особенно ширину столбцов в динамической среде, где вы можете не знать, сколько контента помещается в каждую ячейку таблицы. В некоторых случаях одна колонка очень широкая, а другие сжаты. В других случаях мы получаем одинаковую ширину, но за счет столбца, который содержит больше содержимого и требует больше места. Но нашелся обходной путь CSS-трюков, который помогает немного упростить задачу...

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