CSS Forum

**empiresolutions** · 11-09-2007, 08:45 PM

Basically, I'm trying to get a div *bottom* to stick to the bottom of the page always, regardless if div *content* has enough data to push it down. Simple right? But it also needs to be able to align below the page just below *content* if the page needs to scroll, so it can't be aligned "absolutely". So how's it done?

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Untitled Document</title>
<style type="text/css" title="">
#sidebar {
    background-color: #00CC00;
    float: left;
    height: 100%;
    width: 250px;
}
#content {
    background-color: #FF66FF;
    float: left;
    height: 100%;
    width: 600px;
}
#bottom {
    background-color: #CCCCCC;
    clear: both;
    width: 500px;
    bottom: 0px;
}

</style>
</head>

<body>

<div id="sidebar">Sidebar</div>

<div id="content">
  <p>Main Content Area </p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
 
</div>

<div id="bottom">Bottom Nav Div - this page is layingout correctly. </div>

</body>
</html>

**chrishirst** · 11-10-2007, 07:27 AM

It can't be done using CSS alone.
You would need to use scripting to check if the content height is less than the browser viewport height and set the div style or classname to suit.

BTW. Changing the class name is quicker than setting style properties.

**LadynRed** · 11-10-2007, 12:30 PM

this might work http://www.themaninblue.com/writing/...ve/2005/08/29/

**chrishirst** · 11-12-2007, 06:23 AM

Decided this was a good candidate for one of my occasional DHTML scripting "articles"

"Floating" or "Sticky" Footer?

Write up not quite complete BTW

**empiresolutions** · 11-14-2007, 04:05 AM

Thanks for all the help. These links seem to provide similar ways to do what I'm looking for.

http://scott.sauyet.com/CSS/Demo/FooterDemo1.html

http://ryanfait.com/sticky-footer/

http://www.themaninblue.com/writing/...ve/2005/08/29/