Dumb CSS Question of a Sidebar 100% Height


#1

I know this is probably one of the most basic questions ever asked here, but why can’t I get my theme sidebars to go all the way DOWN unless there is content in there? I mean, the sidebar background is colored, but it ain’t going all the way down to footer.

Here’s the code I am using: width: 130px; height: 100%;

Oh boy… what did I miss? :confused:


#2

Check the height of the sidebar’s container.

You should probably post a link to your site or a fiddle demonstrating the issue.


#3

You’re gonna run into trouble getting that to work cross browser, take a look at this oldie but a goodie article on faux columns:

http://www.alistapart.com/articles/fauxcolumns/

A few more methods:

http://css-tricks.com/7692-fluid-width-equal-height-columns/


#4

Thanks! So I have two options from what I see:

One, create a DIV to include sidebar1/content/sidebar2 - and make this DIV with a height and the 3 inside it with a 100% height…

Or Two, create a DIV to include sidebar1/content/sidebar2 and make a small background image to repeat from top to bottom.

Ok, be back in a couple minutes :slight_smile:


#5

Great! Problem solved!

Used the advice and followed AListApart’s tip: a body background image repeating top to bottom, it’s so small, less then 2k :slight_smile:

You guys rock!! Thank you!


#6

I would go JS way on this one.
If sidebar height > content height, then it probably already sticks to footer, but if sidebar height < content height, just set sidebar height = content height with JS.


#7
shaki said

Great! Problem solved!

Used the advice and followed AListApart’s tip: a body background image repeating top to bottom, it’s so small, less then 2k :slight_smile:

You guys rock!! Thank you!

Change the format to .gif ~2K is still huge, it should be proly ~100-ish bytes.


#8
Ivor said
shaki said

Great! Problem solved!

Used the advice and followed AListApart’s tip: a body background image repeating top to bottom, it’s so small, less then 2k :slight_smile:

You guys rock!! Thank you!

Change the format to .gif ~2K is still huge, it should be proly ~100-ish bytes.

Done. Sometimes I forget these small details. Thanks Ivor :wink: