HTML+CSS проблема с таблицей [колонки не выровнены]

Дорогие форумчане, все привет! Столкнулся с проблемой в тестовом задание. Это веб-журнал, в котором есть баннер и лого, а ниже идет таблица с данными. И вот в самой таблице" Остапа понесло…" , потому что в таблице с заголовком “Лютий” пошел сдвиг в право(скриншот ниже).

Я у вас, как у компетентных людей хочу попросить дать совет и взглянуть на код, явно я пишу с костылями, как вы бы написали это же самое.

[ссылка на код HTML + CSS](http://)

Лютий та Ciчень - они в одной талице? Чтобы сдвига не было они должны быть внутри одной общей table.

Точно)ты прав, но теперь кепшион сдвинулся вверх, наверное шапки внутри тэйбла чем то другим пишут а не повторяющимся кепшионом

Да, это его поведение по умолчанию.

Точно. Я бы делал tr-td-ами Добавь класс соотсветвующей ячейке, который принесет фон и форматирование текста.

Ребят, все правильно Дима подсказал тегами tr-td нужно делать. На всяк случай,пример того что получилось из таблицы.
Пример:

будьте,осторожны с “text-align:center;” из за позиционирования блоки написанные после таблицы будут писаться поверх таблицы… Чтобы этого избежать используйте

table:after{
content: ‘’;
display:block;
height: 0;
clear: both;
}

Всем удачи!

1 Симпатия

Или не пользуйте позиционирование!

table:after{
content: ‘’;
display:block;
height: 0;
clear: both;
}

на первый взгляд эти свойства избыточны
height: 0;
clear: both;

ДА! и гда пример? мне интересно ваше предостережение с text-align:center
чувствую драмма та еще

1 Симпатия

тоже хочу посмотреть

нагнал саспенса, спустя короткую паузу в 2месяца

https://github.com/olmerrr/html_css/blob/c5a927a975eeb25d99d094a469d72760b0d579f7/test.rar