How to make sidebar always as long as content

  • Lets suppose I have a wrapping div (#wrap), a content div (#content) and a sidebar div (#sidebar), what do I have to do so that the #sidebar “grows” with #content and not with the amount of widgets or so in the sidebar?

    My problem is that my sidebar is colored (#000) the same way as my menu and my footer. Those three elements basically merge. But this only works when my sidebar is longer than my #content. When I now write ten posts and the content area becomes longer, the sidebar just stops at one point.

    How can I solve this? I really appreciate some help!
    do77

Viewing 3 replies - 1 through 3 (of 3 total)

  • Rather then applying a seperate background to the sidebar, give the wrapper element a background that includes the background for the sidebar..

    Since your content and sidebar both sit inside this element, it won’t matter which one is longer, because the background will be extending to the height of the wrapper (which will be whichever is longest)..

    You can include the content background as part of the wrapper background, but this isn’t necessary, you can always use a seperate one for the content, just ensure whichever one needs to cover the height of the page (so sidebar in this case) is the background for the wrapper.

    Does that help?

    Thread Starter do77

    (@do77)

    Hey t31os_,

    that actually sounds like a perfect idea. I haven’t though about that …. I will try it out!

    thanks!
    do77

    oh, man, that was a great idea! thanks!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘How to make sidebar always as long as content’ is closed to new replies.

Tags