Quite annoying margin in Safari?

Question

thanks for any help in advance.

I'm 16, almost 17, and I've been working with HTML(5)/CSS(3)/PHP/SQL for a little over five years. But there is one problem I have never been able to fix. I've "tried everything under the sun", but there is a very annoying margin to the right of one of my floated elements that I've never been able to get rid of on any of my pages.

Here's the link: http://www.protodevelopment.de (It's in German, don't worry about the content.)

If you call up the page on a Windows/Android Device, there isn't the slightest problem. But as soon as you look for it on any version of Safari, mobile or desktop, there's the margin on the right.

Again, thanks for any suggestions in advance.

Image is here: http://tinypic.com/r/ekht2r/8

Answer 1

Are you talking about the small white line in the header and footer on the right side? It's the fact that you're calling width: 94% on those elements. Since the container has a width percentage of 75% just use width: 100% and it will extend those to the edge.

EDIT: That is the issue. If you are concerned with the padding use:

-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;

That will keep the box padding from extending past the desired width/height. Then you can set the width to 100%. Set border-box on any element that will receive the padding (ex: header and footer)