Forums

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

Home › Forums › CSS › [Solved] Scroll error | sidebar + content scroll together

  • This topic is empty.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • June 22, 2014 at 3:13 am #173410
    Billy
    Participant

    I am trying to make a two column design that has both a sidebar and a main content area. I want both areas to scroll separately, as the sidebar is an ordered list acting as navigation and can get quite long.

    I specified an overflow-y property for each separately (even for only the sidebar at first), but both sections end up scrolling together.

    Here’s a pen with my code. Look for week-nav and main-content.
    Links don’t work.

    http://codepen.io/_Billy_Brown/pen/jumzb?editors=010

    June 22, 2014 at 5:07 am #173421
    Paulie_D
    Member

    I’ve only taken a quick look but it seems to me that you should be restricting the height of the nav if you want to force a scroll.

    June 22, 2014 at 5:39 am #173426
    Billy
    Participant

    The nav was constrained, but the <html> and <body> tags were not. Applying height: 100% to them fixed the problem.

    Thank you!

    June 22, 2014 at 5:52 am #173430
    Paulie_D
    Member

    Interesting…the codepen now has a scroll on the menu (which is fine) but there is no scroll on the ‘page’.

    Have you fixed your problem?

    June 22, 2014 at 5:55 am #173431
    Billy
    Participant

    The page itself doesn’t fill the height of the screen yet, as I haven’t worked on giving it content yet, but as far as I know it works as I wanted.

    Thanks for the help.

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