Magento

Question

我想知道如何将页脚宽度设置为 100%？我尝试将 .footer-container 和 .footer 宽度设置为 100% 以及绝对位置。

这是网站：

http://buysmartcardsonline.com/

Answer 1

从 class="page" 中删除 class="footer-container" 并使其成为 class="wrapper"

的直接子代

来自

至

Answer 2

如果您将 div.footer-container 移到 div.page 容器之外，它应该会自动覆盖页面的宽度。

之前：

<div class="page">
    ...

    <div class="footer-container">...</div>
</div>

之后：

<div class="page">
    ...
</div>
<div class="footer-container">...</div>

Answer 3

试试下面的代码 - 我希望这就是你要找的

.footer-container {
                   left: 0px;
                   width: 100%;
                   position: fixed;
                   bottom: 0px;
                   }

Answer 4

正如@Hubro 在他的回答中提到的那样，将 div.footer-container 移到 div.page container 之外是最理想的。但是如果你不想移动 div，你可以尝试像下面这样对页脚使用绝对定位

.wrapper{
   position: relative;
}

.footer-container{
    width: 100%;
    position: absolute;
    left: 0;
    bottom: -27px; (height of the footer container)
}

Answer 5

您应该将 .footer-container 放在 .page 之外，然后在 .footer-container 中添加一个 div 和 .page 的 class 以获取页脚中的内容宽度相同。

<div class="page">Your page content</div>

<div class="footer-container">
    <div class="page">
       Footer Content
    </div>
</div>

Magento - 如何将页脚设置为 100% 宽度？

Magento - How to set footer to 100% width?

css

footer