网站宽度显示不正确

Question

正如您在 link ( http://riksblog.com/Marnik/index.html ) 上看到的那样，由于某种原因，正文和网站的宽度是应该的，但是有一个奇怪的空白 space在我的网站旁边，这使得它比它应该的更宽。

我正在使用 bootstrap，所以我无法在 css 中为桌面版本使用这些技巧，例如媒体查询。

Answer 1

您正在寻找溢出 css 属性 试试这个：

body {
overflow-x: hidden;
}

要彻底解决这个问题，请删除此 class 上的正确填充：

section.first .section-content {
padding: 150px 15px //remove left/right padding
}

Answer 2

问题是这样css:

section.first .section-content {
    position: relative;
    width: 100%;
    padding: 150px 15px;
    text-align: center;
}

这会导致 .section-content div 与其父级一样宽加上 30px。

可能的解决方案是在样式中添加 box-sizing 属性

    box-sizing: border-box;

或更改宽度使其不超过其父项

    width: calc(100% - 30px);