我正在测试一个网站：This Website
当我偶然发现以下问题时。我在计算机上测试的所有浏览器（IE，Chrome，Safari，Firefox等）中的一切看起来都是正确的但是当我在iPad上测试这个网站时，在safari浏览器中我在右侧获得了奇怪的边距，我无法显示一个截图，但简而言之，所有网站页面都像你在电脑上看到的那样，但是转移到左侧（所以右边有空白区域）。任何人都可以提出导致这种情况的原因吗？
编辑：
我注意到这个边距在某种程度上受到两侧可以看到的箭头边缘的影响（用于通过幻灯片列出）。按钮的样式具有以下id
#prevslide and #nextslide
EDIT2：
由于代码很长，我会在这里发布网站使用的样式表链接。
幻灯片样式表， #prevslide，＃appetslide 样式规则可在第二个样式表中找到
Style1
Style2
我使用的主样式表来描述网站的外观，但我不认为问题在于它。
答案 0 :(得分：2)
您需要在ipad（和移动设备）的标头中设置元标记：
<meta name="viewport" content="width=device-width" />
这指示浏览器将页面正文设置为与平板电脑大小相匹配。我不是100％确定这是你想要的确切设置，但我没有iPad方便测试;无论解决方案是什么，它都在这个标签中。
答案 1 :(得分：2)
看起来您的问题是因为您的css中％和像素的组合。
例如，您的.header包装器设置为100％，但其中的.in-header设置为1020px。只要您的浏览器窗口宽度超过1020px就可以了，但是当它缩小时，.header会根据浏览器窗口调整自身大小，并且.in-header不是。
在body元素上设置min-width属性，使其不会减少到主页元素的大小以下：
body {
min-width: 1020px;
}