Здравствуйте!
Верстаю макет, в котором информация идет колонками (то есть правая часть сайта - один продукт, левая - второй, грубо говоря). Но сверстать его собственно двумя колонками требует множества ухищрений, т.к. по дизайну все эти колонки разбиты на строки с различным фоном, и этот фон должен тянуться при растягивании мониторов.
Примерная структура выглядит так:
<div class="row">
<div><h2>Заголовок товара 1</h2></div>
<div><h2>Заголовок товара 2</h2></div>
</div>
<div class="row">
<div>Контент товара 1</div>
<div>Контент товара 2</div>
</div>
Если верстать так, как я обычно реализовываю подобные дизайны (где каждую секцию представляет собой div со 100% шириной и .container'ом с контентом внутри), семантическая связь между секциями будет неизбежно потеряна. И
внимание, вопрос: существует ли способ явно указать на секцию, к которой относится такой-то header? Есть ли такая возможность?
И как бы вы реализовали подобное - без семантичной связи, но красивым html кодом, или с семантичной связью, но с усложнениями верстки?
Спасибо.