Bootstrap 5打印时容器内容无法占满宽度的问题解决咨询

我在使用Bootstrap布局系统打印页面时遇到了麻烦。我做了一个打印按钮：

<button class="btn btn-outline-dark" onclick="window.print()">Drukuj</button>

这个按钮用来打印页面内容，我希望打印的GDPR相关内容能占满整个页面宽度，同时不想让用户从我的页面下载任何文件。

我的页面是静态的，用了Bootstrap的tab-pane类，通过导航栏标签切换不同的内容区块，页面结构大致是这样的：

<body>
<div id="navbar" class="container-fluid">
        
    <ul class="navbar nav nav-tabs nav-fill">
        <li class="nav-item">
            <a class="navbar-brand" data-bs-toggle="tab" href="#home-page">
            <img id="logo" alt="logo" src="logo-blank.png"></a>
        </li>
        <li class="nav-item">
            <a class="nav-link" data-bs-toggle="tab" href="#lawyers-page">Prawnicy</a>
        </li>
        <li class="nav-item">
             <a class="nav-link" data-bs-toggle="tab" href="#services-page">Usługi</a>
        </li>
        <li class="nav-item">
             <a class="nav-link" data-bs-toggle="tab" href="#contact-page">Kontakt</a>
        </li>
        <li class="nav-item">
             <a class="nav-link" data-bs-toggle="tab" href="#rodo-page">Polityka prywatności</a>
        </li>
    </ul>
</div>
<article id="content" class="container">
<!-- ...更多标签内容... -->
<div class="tab-pane container fade min-vh-100" id="rodo-page">
    <h1 class="display-4">Informacja RODO</h1>
    <button class="btn btn-outline-dark" onclick="window.print()">Drukuj</button>
    <hr>
    <p><em>Szczegółowe informacje dotyczące przetwarzania danych osobowych klientów kancelarii</em></p>
    <ol>
        <li>
        <p>Administrator danych osobowych</p>
        <p>Administratorem Pani/Pana danych osobowych będzie ...
        prowadząca ... z siedzibą w ...
        przy .... Może Pani/Pan  się z nami skontaktować w następujący sposób:
        <ul>
            <li>listownie na adres: ...</li>
            <li>telefonicznie: ... lub ...</li>
        </ul>
        </li>
    </ol>
</div>
<!-- ...更多标签内容... -->
</article>
<!-- ...页脚等内容... -->
</body>

问题在于Bootstrap的container类自带边距和内边距，用来让内容居中显示，但这在打印时就很麻烦——打印出来的内容会被居中压缩，不能占满页面宽度。

我尝试用CSS媒体查询来修改打印时的样式，写了这些代码：

/*-----------我的问题相关样式----------------*/
@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;
    }
}
/*-------------------------------------*/
/* 我还有一些其他的基础CSS： */
#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也没效果。我也不想把container改成container-fluid，因为我只想修改打印时的显示行为，不想影响页面正常浏览时的布局。

有没有什么解决办法？

备注：内容来源于stack exchange，提问作者InternetWanderer