There is a change when I add height:100; to the HTML element, but it isn't the change I was looking for. I will show you guys my code.
index.php
<html>
<head>
...
</head>
<body>
<div id="container">
...
<div id="leftBar">
...
</div>
...
</div>
</body>
</html>
stylesheets
html {
height:100%;
}
body {
/* Code for the body element */
font-family: Arial;
font-size: 13px;
margin:0 0 0 0;
padding:0;
background-color:#EEEEEE;
height:100%;
}
...
#container {
/* Code for the entirety of the page... contains the page */
margin:0;
border:thin;
border-color:#000000;
text-align:left;
height:100%;
}
...
#leftBar {
/* Code for the left sidebar */
height:100%;
margin-top:0;
margin-bottom:0px;
padding-left:5px;
margin-right:20px;
padding-top:5px;
float:left;
width:19.5%;
height:100%;
background-image: url(../img/sideBar.jpg);
border-right: 1px solid #000000;
border-bottom: 1px solid #000000;
color:#000000;
overflow:visible;
}
I removed large chunks of what I believed to be unimportant code to this situation. I don't know if this code will help, but I still can't get it to work how I would like it to.