getting a div sidebar that goes all the way down

R

Rutger Claes

I want to make a div sidebar like this:

<div id="header">
</div>
<div id="body">
<div id="sidebar">
</div>
<div id="content">
</div>
</div>
<div id="footer">
</div>

So this is a piece of my css file:
#sideBar {
background-color: #999999;
margin: 0px;
padding: 5px;
border-right-width: thin;
border-top-style: none;
border-right-style: dotted;
border-bottom-style: none;
border-left-style: none;
border-right-color: #990000;
overflow: auto;
float: left;
width: 150px;
height: 100%;
}

Now in IE5, this looks OK, the sidebar goes all the way down, but in Opera 7
or Mozilla FireBird, two more recent browsers, the sidebar stops when all
the text is displayed.
So I guess my CSS is /old/...

How do I fix this? What is the correct way to do this?
Rutger
 
S

spaghetti

Rutger Claes said:
How do I fix this? What is the correct way to do this?

You can't make block elements go all the way down like that. You'd have to
use tables, which is just ucky. My suggestion: fake the "sidebar goes all
the way down" with a background image, kinda like I did at
http://aspyre.net/teddgcm/. The background would go in your <div id="body">.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,744
Messages
2,569,484
Members
44,903
Latest member
orderPeak8CBDGummies

Latest Threads

Top