Fancy x-overflow

[DSS]

Hello everybody!
I have a problem on my website: The body is 100% wide, but there is a horizontal scrollbar, which allows to scroll horizontally a little bit. Obviously the nav#header and footer are overlapping the regular size of the body, though they are set to 100% also.

body: 100%
1) nav#header: 100%
2) page (=wrapper): 960px, horizontally centered by margin-auto
3) footer: 100%

Examples:
http://www.belleslettres.eu/index.php
http://www.belleslettres.eu/artikel/adj … nation.php

It didn’t help to set nav and footer to overflow-x:hidden. There is a right-floated ul in the nav#header. I am not sure, if this causes the overlapping.

I can get rid of the overlapping by setting the body-element to overflow-x:hidden, but what happens, if the browser window is less than 960px, which is the width of the wrapper (div#page)?

Thanks for helping!
Lina

[falkencreative]

At least on Firefox for the mac, if I remove "-moz-box-shadow:0 3px 10px #2A2625;" from "nav#header" in the stylesheet, that fixes it for me.

Seems like removing that line and using a background image instead would be the solution here that should remove the scroll bar. As I said though, this is only tested in Firefox, so you should also check if this takes care of IE as well.

[DSS]

Thanks Benjamin,
this is it.
Lina

[Author]

Posts