I am trying to make a website for one of my modules in college and I have come across a little problem.

http://joehowlin.com/onlinesafety/index.html

The left hand sidebar doesn't extend down to the footer (the same would happen to the right hand sidebar if the text wasn't there). I have tried to set the height of the sidebar to 100% and it didn't change the height at all.

I can't really have the sidebars at a set pixel height because there will be different amount information on different pages.

So anyone know how it can be changed?

You're link doesn't work.

Sorry, it's fixed now.

You could try using min-height: http://www.w3schools.com/CSS/pr_dim_min-height.asp

 

And it's "your", not "you're".

I never type the right your when I'm online cause I don;t pay attention to what I type beyond the basic meaning.

You could try using min-height: http://www.w3schools.com/CSS/pr_dim_min-height.asp

 

And it's "your", not "you're".

Thanks, but that would only work if the length of each page is the same. The different pages on my website will have different lengths, so it really work. Unless I set the side bars to the length of the longest page, but that would a massive waste of space on a lot of other pages.

Tried using

 

height: 100%;

min-height: 100%;

 

for the html and body tags before using it on div elements? They can't inherent a % without knowing how much the parent is using.

Tried using

 

height: 100%;

min-height: 100%;

 

for the html and body tags before using it on div elements? They can't inherent a % without knowing how much the parent is using.

Yeah that was my thought with it as well :?

Yea, I messed around with it not long after my post and got it work. Looked like crap since it was a 2min hack on the html and the header px height was added to the 100% page height to push the footer down, etc. So much annoying trash. Now I remember why I build the layout using filled div elements and deal with content later :lol:

 

I was def missing something, but didn't have the time to look for it.

The only way I can get that to work is if style="height:100%" is in the html tag. The problem with that is, it causes a validation error. I want my website as html valid as I possibly can. So while it can work that way, I would nearly call that plan b. Do you happen to know any other way?

separate the style attributes into their respective parts of your css file :) go from there. i didn't do it because i was lazy.

Thanks, I seem to have it working. http://joehowlin.com/onlinesafety/orgins_of_the_internet.html

excellent - how far off was i? junk like height/min-height seems to work so much better when the page needs to scroll anyway.