Содержимое контейнера BootStrap 5 не на всю ширину при печати ⇐ CSS

[Anonymous]

У меня возникли проблемы с системой макетирования BootStrap при печати страницы.

Предположим, есть кнопка

• Код: Выделить всё

  Drukuj

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

Однако я разработал статическую веб-страницу без URL-адресов, используя классы панели вкладок, которые просто переключают содержимое статического идентификатора при нажатии на вкладку панели навигации:

Код: Выделить всё

[list]
[*]
[url=#home-page]
[img]adwokatura-polska-blank.png[/img]
[/url]

[*]
[url=#lawyers-page]Prawnicy[/url]

[*]
[url=#services-page]Usługi[/url]

[*]
[url=#contact-page]Kontakt[/url]

[*]
[url=#rodo-page]Polityka prywatności[/url]

[/list]




Informacja RODO
Drukuj

Szczegółowe informacje dotyczące przetwarzania danych osobowych klientów kancelarii
[list]
[*]
Administrator danych osobowych
Administratorem Pani/Pana danych osobowych będzie Adwokat Milena Gostyńska
prowadząca Kancelarię Prawną Adwokat Mileny Gostyńskiej z siedzibą w ...
przy .... Może Pani/Pan  się z nami skontaktować w następujący sposób:
[list]
listownie na adres: ...
[*]telefonicznie: ... lub ...
[/list]

[/list]

Проблема в том, что BootStrap использует специальный стиль для контейнеров (у которых есть поля и поля для удобного центрирования содержимого).
Однако эта полезная функция портит мою печать, поскольку она занимает все окно:

[*]Очень центрированная печать.
< /ul>
Как я могу использовать CSS для распечатки содержимого статьи без отступов и полей контейнера BootStrap?
Мой HTML-заголовок:

Код: Выделить всё

Kancelaria Prawna - Adw.  Milena Gostyńska

Я не очень хорошо разбираюсь в CSS, но вот что мне пока удалось сделать:

Код: Выделить всё

/*-----------My problem----------------*/
@media print {
body {
visibility: hidden;
display: contents;
}
#navbar, footer {
display: none;
}
#rodo-page {
margin: 0 0 0 0 !important;
padding: 0 0 0 0 !important;
width: 100% !important;
visibility: visible;
text-align: left;
}
}
/*-------------------------------------*/
/* Obviously I have more CSS, such as: */
#content {
background-color: lightgrey;
border: solid;
border-color: dimgrey;
}

.tab-pane .display-4 {
text-align: center;
margin-bottom: 1em;
}
.tab-pane p, .tab-pane ul{
font-size: larger;
}

body{
background-image: linear-gradient(#006241,#32913a);
background-attachment: fixed;
}

Код: Выделить всё

!importantКлючевое слово 

, похоже, не работает. Мне удалось переместить весь текст наверх, но текст по-прежнему центрируется по горизонтали.
top: 0 с left:0 тоже не сработало.
Смена контейнера на контейнерную жидкость тоже не для меня: речь идет только о поведении при печати.

Какой совет?

Подробнее здесь: https://stackoverflow.com/questions/793 ... n-printing