Hi,

I've been racking my brains on this for ages!

My website www.ukwildcamping.com doesn't display properly on my iPad, it only displays 3/2's of the screen's width. I've tried using the developer tools to diagnose it but without luck.

Can you of clever lot tell me what I'd doing wrong?

Many thanks

Rich

try removing all the widgets from the right widget area.

Hi,

I've tried removing each widget and removing the lot but no joy. One thing I've noticed is that the page loads correctly but resizes at the end.

I've reset all settings and it looks fine so it must be a custom setting I've set somewhere.

I noticed that on my iPad the tag cloud (right sidebar), the twitter feed (left sb) and some of your galleries seem to exceed their alloted space - ie they bleed thru their columns.

Here is what I would do
1) change the # posts displaed to 1 and add a new test post (50 words or so)
2) remove all the widgets from both sidebars

and see what that does. If it goes full screen, then add thing back in till you find the culpret.

I just looked at a site of mine and it is fine so it has to be content or ossibly one of your settings. If the removing widgets/images from posts doesn't work, export yout settings and attach them to a reply and I'll see if it effects my site.

Hi,

I tried both suggestions and no difference, I have noticed that if I refresh the page every so often it displays ok.

Config attached.

R

ok, it's now time to learn some debugging.

since you have an export of your settings - hit the gray 'Reset ALL theme options' at the bottom of any page and then look at your site on your iPad. it should look fine.

Now import the settings (I always hit the green save button after the import)
next go thru each option page and hit the RED 'Reset Setting' button and go look at the page on the iPad.

When there is finally a change - you know the option page that is causing the issue. So you re-import your original settings (hitting save after the import) and go to the troublesome option page and look at each option. For any that are different from the default, you can set them back to teh default, hit save and test and repeat till you find the offending option.

Now you can look at that option and see if you can determine what the issue is.

And yes I know what the issue amd will be interesting in seeing what you discover yourself.

Thanks v much!

So I've tracked it down to the Body Style settings:

font-family: tahoma, arial, sans-serif;
font-size: 0.8em;
color: #000000;
background: #000000;

If I set the font size to 0.8 then it looks ok, if I increase the font size it breaks it.

I can't seem to get it to work, each time i alter the text sizes it move things about and breaks the spacing.

nope, that's the wrong theme option causing the problem - it is NOT the Body Style setting

Can I have a clue?

Try resetting the areas under 'Header Area' and see what happens.

OK so I now have:

padding: 10px;
float:none;
margin-left:auto;
margin-right:auto;
text-align:center;

In the Blog Title Style, however I can't get it to centre?

OK so I think I've cracked it!

Width:100% seems to have sorted it!


padding: 20px;
text-align:center;
float:none;
margin-left: auto;
margin-right: auto;
width: 100%;

did you happen to reset the look at the settings in ATO->Header Image page?
or look at the settings in ATO->Header Image->Overlayed Blog Title/Tagline Style?
see anything odd?

Yes that's where I made the changes to the width etc, which now looks like:

Header Area> Header Image> Overlayed Blog Title/Tagline Style

padding: 20px;
text-align:center;
float:none;
margin-left: auto;
margin-right: auto;
width: 100%;

Just need to sort out the Twitter timeline width now!

yeah, having 'width: 80em' could mess things up a bit