html - 宽度 : 100%; give me a scrollbar

Question

我想在页面底部制作一个粘性页眉和页脚

这两个陈述都让我发疯，因为它给了我一个滚动条。

.header {
        opacity: 0.95;
        padding-left: 3.7%;
        list-style-type: none;
        margin: 0;
        background-color: #4b4b4b;
        font-family: 'Roboto', sans-serif;
        background-image: url('img/icon.png');
        background-repeat: no-repeat;
        background-position: 14px 7px;
        background-size: 40px;
        position: absolute;
        width: 100%;
        z-index: 100;
}

.footer {
        bottom: 0;
        opacity: 0.9;
        width: 100%;
        background-color: #4b4b4b;
        color: #878787;
        text-align: center;
        padding: 6px 16px;
        font-family: 'Roboto', sans-serif;
        margin-top: 4%;
        left: 10px;
        right: 10px;
    }

我怎样才能避免这些滚动条？

谢谢!

Answer 1

这很难，因为您没有提供任何 html 结构或很多 css。我猜你没有任何填充重置或框大小调整。尝试在您的 CSS 之上添加这一行。不确定您的水平，但星号表示适用于所有元素。

* {
  box-sizing: border-box;
}