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

Home Forums CSS Bringing the x scroll bar back with media query

  • This topic is empty.
Viewing 1 post (of 1 total)
  • Author
  • #33509

    This has to be simple, but I’m just not getting it.

    Here’s the deal: I’m building my portfolio site and wanted an infinite width kind of thing, where the backgrounds of the various element extended as wide as the screen gets.

    I found a good answer on this site, of course, and it involves simply setting a huge negative horizontal margin value and the exact same huge but positive padding value on the elements, and then setting overflow-x: invisible

    Kinda like this:

    body {
    overflow-x: hidden;
    background: #ffa200 url(../img/header-bg.png) repeat-x;
    margin: 0 -3000px;
    padding: 0 3000px;
    height: 166px;


    Example here:
    The problem is, I want the scroll bar to come back of the window is sized below the layout width of 960px, so things don’t just disappear off the screen.

    The extent of my media query attempt went like this, and does not seem to work:

    @media screen and (max-width: 960px) {
    body {
    overflow-x: scroll;
Viewing 1 post (of 1 total)
  • The forum ‘CSS’ is closed to new topics and replies.