Question

On iPhone the divs masterhead, middleline, middle, bottomline, bottom, colophonline and colophon doesn’t reach all the way on the right side. But on the desktop they do. I wonder why. I’ve tried to apply negative margins to the divs but it didn’t change a thing. unfortunately I have not tried it on iPad.

The site:
http://www.domda.se

Answer 1

You have a couple of serious HTML errors. Stray tags can affect your layout and chances are great that differences between browsers will be noticeable.

Secondly, I’m seeing a right side space (margin or padding?) within my desktop version of Safari. This space is causing a perpetual horizontal scroll-bar. No matter how wide I make the window, all the way to 1900+ pixels, the scroll-bar remains.

When I remove padding-right: 10px; from your #colophon element located in the style.css file, the right side spacing issue vanishes and so does the annoying scroll-bar.

When I pull up your site on iOS, I’m seeing your issue and I believe it’s caused by this right side padding on #colophon.

I’m not sure what the purpose is, but I think you can safely delete this padding-right: 10px; without detriment. Although, you need to clear your HTML validation errors and test in all browsers to be sure.