html - 我的页脚没有占据页面的整个长度 - Bootstrap

Question

我知道这个问题已经被问过好几次了，但我没有找到适合我的情况的任何解决方案，我尝试将 this solution 上指定的容器流体放入其中，但似乎不起作用。

一切都很顺利，但是当我添加页脚时，它不会占用页面或行的整个长度，而是由容器流体引起的填充。

这是代表问题的图片:

如您所见，边框并未完成整个长度

这是我从容器流体中移除填充物时的照片，其中包括我的所有主要内容:

如您所见，出现了溢出-x

所以我的问题是，我是否需要担心解决溢出问题，或者将我的页脚放在整个长度上？我不知道该走哪条路!

我的 HTML 页脚:

<footer id="footer">
    <div class="row">
        <div class="col-md-12">
            <div class="row">
                <div class="col-md-6">
                    <form action="" method="post">
                        <div class="form-group">
                            <label for="email_newsletter">S'inscrire gratuitement à la Newsletter :</label>
                            <input type="email" id="email_newsletter" class="form-control w-50 email" aria-describedby="email_newsletter_note">
                            <small id="email_newsletter_note" class="form-text text-muted">Nous ne partageons en aucun cas vos informations.</small>
                        </div>
                        <button type="submit" class="btn btn-primary">Valider</button>
                    </form>
                </div>
                <div class="col-md-6">
                    <a href="">Mentions Légales</a>
                </div>
            </div>
        </div>
    </div>
</footer>

Answer 1

解决方案:

我的页脚位于容器流体中，将其从那里取出并向我的页脚本身添加容器流体就足够了:

<footer id="footer" class="container-fluid">
    <div class="row">
        <div class="col-md-12">
            <div class="row">
                <div class="col-md-6">
                    <form action="" method="post">
                        <div class="form-group">
                            <label for="email_newsletter">S'inscrire gratuitement à la Newsletter :</label>
                            <input type="email" id="email_newsletter" class="form-control w-50 email" aria-describedby="email_newsletter_note">
                            <small id="email_newsletter_note" class="form-text text-muted">Nous ne partageons en aucun cas vos informations.</small>
                        </div>
                        <button type="submit" class="btn btn-primary">Valider</button>
                    </form>
                </div>
                <div class="col-md-6">
                    <a href="">Mentions Légales</a>
                </div>
            </div>
        </div>
    </div>
</footer>