Всем привет! Не могу побороть задачку:
на сайте, на некоторых страницах встречаются вот такие таблицы:
take.ms/1Vjxu
Нужно сделать так, чтоб при включении мобильной версии сайта таблицы занимали всю ширину окна, вот так:
take.ms/NLHVB
Проблема заключается в том, что все таблицы лежат в контейнере, который ограничивает ширину не только самой таблицы, а еще заголовков, списков и тд и тп. (например выше есть абзац).
Думал о том, чтоб оборачивать таблицу во wrapper и ему давать отрицательный margin
if (window.matchMedia('(max-width:1100px)').matches) {
$('.table-responsive').wrap('<div class="table-wrap"></div>');
}
Но у контейнера очень хитрая ширина и не получается вычитать правильный отступ.
width: calc(90% - 40px)
Буду очень благодарен за советы.