当页面调整为较小的宽度时，网站在页面右侧和标题的右侧有巨大的空白答案

【问题标题】：Website has huge whitespace on right side of the page and of the header when the page is resized to a smaller width当页面调整为较小的宽度时，网站在页面右侧和标题的右侧有巨大的空白
【发布时间】：2018-06-27 14:14:35
【问题描述】：

我已经尝试了很多在 stackoverflow 中列出的解决方案，但我无法解决这个问题.. 这是一个 wordpress 网站。 http://www.delice-ikbal.com/

我试图从<html> 和<body> 中删除任何边距或填充，但没有帮助。

我也尝试过类似的方法：

html,body
{
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
    overflow-x: hidden; 
}

overflow-x: hidden当然不允许水平滚动..所以当页面宽度变小时内容完全不可见

所以我想删除页眉和页面右侧存在的空白。

谢谢。

【问题讨论】：

您能否更具体地介绍一下我们需要复制的浏览器/行为以查看此错误？
@leaksterrr ：谢谢。我用截图更新了我的问题:)

标签： html css whitespace removing-whitespace

【解决方案1】：

您有很多以 px 为单位硬编码宽度的容器。

删除 .main-navigation 中的 max-width: 1080px，这是导致问题的容器。

编辑：在 div.nav-menu > ul

ul.nav-menu, div.nav-menu > ul {
   margin: 0;
   padding: 0 40px 0 0;
}

【讨论】：

显然不是问题。
是的，删除 div.nav-menu 中的 1080px > ul，问题已转移
是的。谢谢你:)

【解决方案2】：

使用这个 css

.site-header {
    background-image: none;
    background-color: rgb(36, 17, 0);
    min-width: 1000px;
}

【讨论】：

谢谢。这解决了页眉问题，但不能解决页面右侧的边距问题。任何想法？谢谢你:)