LEFT
CONTENT

The example shows how to place position: fixed divs with background-colors or background-images under the divs which have different content heights so that the backgrounds are equal in height. This method shows three columns and the center column has a fluid width. This example also has a sticky footer.

View source code to see the html markup and css in the head section style tag.

This position: fixed method is the same as the position: absolute method except that at widths below min-width: 500px set for #site_wrap the position; fixed right yellow background moves sideways across the middle div as it's fixed to the right side so in this respect the position: absolute method is better for narrow viewports.

Text

Text

Text

Text