The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Fancy x-overflow

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • #28693

    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: … 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!


    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.


    Thanks Benjamin,
    this is it.

Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘CSS’ is closed to new topics and replies.