100% height issue

  • M J

    (@m2j)


    15 years, 6 months ago

    Hello All,

    I’m using this theme: http://demo.graphpaperpress.com/mansion/

    And I want the left hand navigation menu to reach all the way to the bottom. I adjusted the heights of all of the below to 100%:

    body {background: #FFF; font: 14px/18px "Lucida Grande",Arial; color: #ddd; height:100%;}

#container {margin:0; height:100%;}

#header {background: #FFF; width: 200px; float: left; height:100%;}

    However, when I do this, the image boxes end up right on top of my navigation menu. Am I missing something? Any help would be greatly appreciated.

    Thank you,
    MJ

Viewing 4 replies - 1 through 4 (of 4 total)
  • Thread Starter M J

    (@m2j)

    15 years, 6 months ago

    any thoughts? anyone?

    esmi

    (@esmi)

    15 years, 6 months ago

    Try setting a min-height in pixels. 100% simply won’t work.

    Thread Starter M J

    (@m2j)

    15 years, 6 months ago

    would you mind explaining why that’s the case? and whether there is a work around?

    the main problem is that I have content in the footer that I want visible and if i set a min-height, it will put it all down way too far one pages that have minimal content.

    i found the jquery plugin the theme developer used to make the tiles collapse: http://desandro.com/demo/masonry/docs/ and I have a feeling the solution will be in there, but my level of understanding of javascript is minimal so any help would be appreciated!

    thanks!
    -mj

    esmi

    (@esmi)

    15 years, 6 months ago

    would you mind explaining why that’s the case?

    Because that’s not how CSS & browsers work. Try googling on “css faux columns”.

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

The topic ‘100% height issue’ is closed to new replies.