Как переопределить стили в блоке container при печати html страницы?

Рейтинг: 1Ответов: 1Опубликовано: 30.07.2025

Есть верстка страницы с помощью Bootstrap. Нужно настроить отображение вывода страницы при печати, всё вроде настроил, но не могу понять, как переопределить стили для блока container, почему то его всегда располагает по середине страницы при печати (при установки полей "По умолчанию", а при выборе "Минимальные", контент растягивается), если в верстке container поменять на container-fluid то всё отображается как нужно, весь контент растягивается на всю страницу... Пробовал переопределить стили в @media print

@media print {
   // Смещается к левому краю полей, справа остается большой отступ...
  .container{
      padding: 0 !important;
      margin: 0 !important;
      width: 100% !important;
    }
}

Не реагирует... Подскажите, как сделать? Менять container на container-fluid не вариант...

UPD Получилось "наколхозить" вот так:

@media print {
  .container{
     all: unset;
   }
 }

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

css bootstrap
Источник: Stack Overflow на русском

Ответы

▲ 2Принят

Так должно сработать.

@media print {
  .container {
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}