iPad上的宽度不正确 [英] Incorrect width on iPad

问题描述

在开始新公司的工作后，我被指控为他们建立一个新网站。这就是我到目前为止所做的：

After starting work for a new company, I've been charged with building a new site for them. This is what I've got so far:

http：/ /ghostevolution.com/ghostds/

问题是它在iPad上无法正常工作 - 标题背景颜色不会延伸到整个屏幕的全宽，就像它的意思一样 - 对于诸如 http://ghostevolution.com/ghostds/?page_id=160

The problem is that it isn't working correctly on the iPad - the header background colour doesn't stretch across the full width of the screen like it is meant to - this is also true of the mid-section light-grey background colour on pages such as http://ghostevolution.com/ghostds/?page_id=160

有谁知道这是为什么？谢谢。

Does anyone know why this is? Thank you.

推荐答案

这是由于经常被遗忘的问题（在桌面浏览器中也是如此）。我很确定..

This is due to issue that is often forgotten (in desktop browsers as well). I'm pretty sure..

你看，使用任何桌面浏览器。更改窗口宽度小于包装器宽度并向右滚动。这会将页面显示为截止。

You see, with any desktop browser. Change the width of the window less than your wrapper width and scroll to the right. That would show the page as cut off.

这很容易修复。
_{删除了csspivot网站，因为它不再运行}

This can be fixed quite easily. _{removed csspivot site since its no longer running}

基本思路是添加相同的背景因为浏览器无法做任何事情，所以它被切断为具有固定宽度的元素。

The basic idea is to add the same background that gets cut off into element that has fixed width since browser can't do anything to that.

添加CSS：

#auxiliary .wrap {
background-color: #bbb; /* Same as the #auxiliary bg color*/
}

#branding .wrap {
border-top: 6px #92C201 solid; /* Same as #branding border and bg and height*/
background-color: #333;
height: 60px;
margin-top: -6px; /* I wouldnt necessarily use this to get it to top but works as well. */
}

这篇关于iPad上的宽度不正确的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！