| Skip to content | Skip to main site navigation | Skip to sidebar navigation |

Posts Tagged "debugging"

Fixing Backgrounds that Don’t Extend to the Bottom: Part II

by Yvonne | March 23rd, 2008 @ 11:01pm | Permalink to "Fixing Backgrounds that Don’t Extend to the Bottom: Part II" | 1 Comment

<div id="container">

     <div id="main">
           ...
     </div> <!-- end main -->

     <div id="sidebar">
          ...
     </div> <!-- end sidebar -->

      <div style=”clear: both;”> </div>

</div> <!-- end container -->

Go to "Fixing Backgrounds that Don’t Extend to the Bottom: Part II" »

Fixing Backgrounds that Don’t Extend to the Bottom: Part I

by Yvonne | March 23rd, 2008 @ 2:17pm | Permalink to "Fixing Backgrounds that Don’t Extend to the Bottom: Part I" | 1 Comment

The problem with non-extending backgrounds shows up when the floating box is longer than the non-floating box. When you float a box, it stops taking up floor space inside the container box. The height of the container box expands and contracts to provide just enough floor space for the boxes inside. So when you float a box for the sidebar, the container box contracts to the height of the non-floating box, taking the background with it:

A web page with a floating sidebar taller than the main content.

Go to "Fixing Backgrounds that Don’t Extend to the Bottom: Part I" »

|
|

Tag Cloud