网站右侧巨大的空白区域答案

【问题标题】：Huge White Space on Right Side of Website网站右侧巨大的空白区域
【发布时间】：2014-04-12 00:33:00
【问题描述】：

我有一个Genesis Child Theme，它的行为很奇怪。布局看起来正确，但右侧有一个巨大的空白区域，底部有一个滚动条。我一生都无法弄清楚是什么导致了空白。当我使用开发人员工具进行检查时，没有一个 div 伸出该空白区域，而且我在 css 中找不到任何会导致该问题的东西。

网站的基本结构是

<body>

  <site-container>

    <header>
    </header>

    <site-inner>
    </site-inner>

    <footer>
    </footer>  

  <site-container>

</body>

在上述结构中还有其他 div，但它们有很多，我不确定列出每个是否有价值，因为需要检查网站本身。我不可能列出整个代码结构，因为它是一个基于 genesis 的 wordpress 网站。

有没有人知道可能是什么导致了空白？我以前在 genesis 子主题中遇到过这个问题，但结果证明这是一个没有调整大小的图像，很容易找到问题。这次我一辈子都找不到了。

【问题讨论】：

不是没有看到代码/网站，但我可能听起来你的宽度设置得相当宽。
或打开的 /div。或者将margin-right 设置为一个高负数。或者如果幻灯片是全宽的，它可能会被设置为一个非常大的宽度，并且没有溢出：隐藏....它可能有很多东西..让我们看看那个网站
哦，我完全忘记链接网站了！它现在在原始帖子中链接。

【解决方案1】：

问题是由您的搜索输入中的一些 CSS 引起的，大约在第 1456 行。删除width: 100%：

#search-3 input {
    width: 100%;
}

【讨论】：

什么？为什么这会导致实际站点旁边的空白与站点本身一样宽？不应该宽度：100%；将其包含到父 div 的最大大小？父 div 定义了最大宽度。
也许它与它旁边的绝对定位输入按钮有关？我发现那是在常规流程之外并且在右侧。无论哪种方式，它现在看起来都应该如此。非常感谢您的帮助！
很高兴有帮助。从我所见，链条的宽度并不多，所以首先要确定它的宽度是相当宽的。无论如何，使用负向左设置将其移出屏幕可能会更好，而不是使用剪辑来隐藏它，但这取决于您。 :-)