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
<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