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

Home Forums CSS 100% Height. The bane of my existence.

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

    You’ll see the problem immediately – the sidebar won’t stretch to fit. I’m still learning CSS, but it was my understanding that if you gave the document a height of 100%, and that you could give individual divs a height of 100% and they would interpret that percentage based on the height of the entire document … I guess I’m wrong about that.

    Can someone give a clear solution to this? I run into this issue frequently and it seems fixing it is always a hack-job.

    :) thanks!!!


    I have just come onto this forum to ask exactly the same question, it’ll be a big thanks from me too, for some answers on this.



    Oke`, first of all.

    If you want to apply a style to the entire html don’t do it like this.

    html { style }

    /* The correct one is */

    * { style }

    Your problem is that you have applied height: 100% to all divisions, why? And also, why do you position: relative all your divisions?

    If you want your sidebar 100% of users screen do it like this.

    body { height: 100% }

    #sidebar { height: 100%; }

    I tried to apply it straight to your code, the bad news is that it’s messing the whole site, you will see if you try it. The good news is that it’s working and it’s stretching the sidebar to the whole height of the screen.

    I think your code is bad, you should rewrite it.

    Here’s an example.

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