为啥我的页脚宽度没有达到智能手机上的全宽？我正在使用 WordPress

Posted 2023-03-21

【中文标题】为啥我的页脚宽度没有达到智能手机上的全宽？我正在使用 WordPress

【英文标题】：Why is the width of my footer not reaching the full width on smartphone? I'm using Wordpress为什么我的页脚宽度没有达到智能手机上的全宽？我正在使用 WordPress

【发布时间】：2017-10-28 22:28:47

【问题描述】：

我的 Wordpress 网站有一个页脚样式，但在移动设备上似乎没有达到网站的全宽。此外，我总是能够滚动宽度方式，就好像网站比移动视口更宽一样。这只发生在移动肖像上，而不是在台式机或平板电脑上。

我将所有宽度设置为 100%（页眉、正文、页脚和其他几个），但似乎页脚宽度呈现为 1333 像素宽度，而页眉和正文宽度呈现为 1349 像素（如检查开发工具笔记本电脑）。

对于以像素为单位设置的超过 300 像素的任何元素，我没有固定宽度。

页脚放置在主容器和主容器之外，但在正文中。

我认为页脚中的任何元素都不是问题，因为我已经删除并替换了它们，但同样的问题仍然存在。

包括照片：页脚右侧的间隙

【问题讨论】：

欢迎来到SO，请提供您的代码以更好地了解情况。

您好，感谢您的欢迎。你想要代码的哪一部分？页脚、页眉或正文的 css 或其中一个或所有这些的 html？

【参考方案1】：

这个问题可能是因为您在整个网页上的一个 HTML 标记（页脚之外）比屏幕大 这个问题不是来自页脚，请检查网页的其他部分

【讨论】：

嗨@Hazem Nabil，我挑选了所有的html，并且如前所述，主要元素的所有宽度都被定义为100%（所以在技术上应该都适合屏幕）。我在标题中有以下内容，我怀疑这是造成问题的原因：

我在 functions.php 文件中也看不到任何与宽度相关的内容。请记住，这仅发生在移动纵向视图中，尽管在我对该尺寸视图的 css 媒体查询中似乎也没有任何原因。你想让我发布媒体查询的 CSS 吗？我觉得我要放弃了，老实说，这让我感到困惑太久了，我只是一个新手..

我看到“Tweet”在页脚之外。

当你告诉浏览器这个DIV的宽度是100%时，浏览器会计算屏幕的宽度并使自己的大小相同，但是在你的手机纵向视图的情况下，内容的 div 大于 100%

要解决这个问题，只需删除“Tweet”或在新行中添加“Upvote”和“Tweet”

【参考方案2】：

您好 Hazem，再次感谢您的回复。更新：我现在知道是什么导致了这个问题。在设置为 80% 宽度的内容 div 上以像素为单位设置的左边距增加了页脚右侧的间隙，但仅在移动视图上。然后我意识到我的媒体查询不起作用，但我现在已经解决了这个问题，因此我已经解决了问题。 感谢您的帮助。