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/ The problem is that it

Solution 1:

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.

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.

Add 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. */
}