iPhone iPad page formatting issue

Question

I am working on this site and have found that on every browser the page centers ok, but on an iPad the page renders hard up against the left side of the screen. This is also the case on an iPhone and Galaxy. Also the "Add This" buttons do not appear on mobile devices but work OK in all browsers on DT/NB.

Browser view:

iPad mini view:

As example, the header area which should render dark across the browser (per image) is:

HTML:

<div class="title-bar bar"></div>

CSS:

.bar {
position: absolute;
width: 100%;
left: 0;
top: 0;
z-index: -99;
}

.title-bar {
background-color: #000;
height: 150px;
width: 100% !important;
}

Any suggestions welcome. Thanks!

Answer 1

i think this meta tag divice width problem.

<meta name="viewport" content="width=800">

meta tag that i given in this meta tag in width="800" put your website width instead of 800. put this meta tag in head tag

eg.

<meta name="viewport" content="width= your website width">