页眉和页脚不是以移动主题为中心，而是在桌面上？

Question

我刚刚创建了一个博客，一切在计算机上看起来都很完美，但是当我访问移动网站时：

1. 页眉和页脚不居中
2. 在移动网站上的关于页面上，照片超出了帖子宽度（即使在桌面上没有）。

请帮忙，我不知道问题所在！对于我的第一个问题（页眉和页脚未集中在移动设备上），我尝试将边距设置为“0 auto”但它不起作用，对于第二个问题（移动设备上的照片溢出）。我已经尝试了图像的最大宽度，但它不起作用。

我知道一些代码（我参加过关于 HTML 和 CSS 的课程），但我没有使用移动网站的经验，因此我将不胜感激！

这是我网站的链接：http://apaperescape.tumblr.com/

另外，我不确定我需要提供什么代码，所以请告诉我！

Answer 1

这里有多个问题。至少对我来说，您的页眉和页脚在移动调试模式下完美居中。也就是说，这里有几个问题：

1. 如果要居中，您需要将内容宽度设置为小于 100%。或者您也可以使用 margin:auto 使其居中。

2. 您的图片也需要设置为页面的一定百分比。比如你可以为图片写一个div，设置成width:80vw，然后把图片显示为：

   background:url("imagehere");
   background-size:contain;
   

或者，您可以将宽度和高度设置为 vh 或 vw 百分比，前提是所有图片的宽高比相同。

您也可以只将图像设置为 100%，并让父 div 进行缩放。以下是一些其他方法： Contain an image within a div?

1. 您的页面有多余的 padding-left，即 1em。内容 div 也有多余的填充，即 50 像素。这导致内容溢出。这很奇怪，但是填充超出了 100% 规则并且可以将其推到 120% 等。剪掉填充，缩小内容分隔线，然后使用 margin:auto 将其居中。它将以这种方式更好地显示跨平台。