Question

我无法让我的页脚工作。出于某种原因，它提供了100％宽度的滚动条。我试图实现Sticky Footer技术，问题出了问题：D

这是控制页脚的css代码：

.mf{
background: #eaeade;
width: 100%;
padding-left:100px;
padding-top:51px;
padding-bottom:11px;
position: absolute;
margin: 0 auto;
bottom: 0;
}

这是html：

<div style="background-color:#EAEADE;text-align:center;overflow:hidden;">
                    <div class='mf'>
              <div class='home-links-footer' style="color:#8E8E80;">
                <a href="index.php">Home</a> | <a href="index.php?option=com_content&view=article&id=14&Itemid=5">Beveel ons aan!</a> | <a href="index.php?option=com_content&view=article&id=4&Itemid=2">Onze Services</a> | <a href="index.php?option=com_content&view=article&id=5&Itemid=3">Laptop Reparatie</a> | <a href="index.php?option=com_content&view=article&id=6&Itemid=4">Onze Tarieven</a> | <a href="index.php?option=com_content&view=article&id=14&Itemid=5">Contact Gegevens</a> | <a href="#">Sitemap</a>
              </div>
              <div style="color:#8E8E80;border-bottom:1px dotted;padding-bottom:3px;width:700px;margin:auto;">
                Friese Computerservice - 8932 JZ Leeuwarden - <a href="mailto:info@friesecomputerservice.nl" style="text-decoration:none;"><span style="color:#F57F20;font-weight:bold;">info@friesecomputerservice.nl</span></a> - Tel. 058-8446628 Mob. 06-29594595
            </div>
        </div>
    </div>

Answer 1

您必须了解CSS框模型将“宽度”视为框的内容的宽度，而不是框的整体大小。您已经在左侧和右侧给出了盒子填充，因此填充将在之外 100％宽度。

就我个人而言，我发现这是一种非常奇怪的机制，但你去了。

应的工作原理（但不会在旧的IE版本中）不提“宽度”，只需将“左”和“右”设为0.

CSS：大水平滚动条的小页脚问题

1 个答案: