sidecol Content

The background color on this div will only show for the length of the content. If you'd like a dividing line instead, place a border on the left side of the #mainContent div if the #mainContent div will always contain more content than the #sidecoldiv.

Donec eu mi sed turpis feugiat feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut, sapien.

Main Content

Download this zip file.

The mainContent div is set to 46em which creates a container that will fit in an 800px browser window if text is left at browser default font sizes

Tips for this template

1. If you give the #mainContent div a font-size value different than the #sidecol div, the margins of the #mainContent div may need to be adjusted since the margin uses the font size of the #maincontent div and not the sidecol div to determine the width of the margin. Make sure you test in multiple browsers if you change the font size.

2. The Internet Explorer Conditional Comment in the head section, the zoom property is used to give the mainContent "hasLayout." This can IE specific property can prevent some IE-specific bugs that and since it is contained in a conditional comment it will not effect other browsers.

Full height side column

This is the full height left side column to make it a full height right side column switch the sidecolumn div from right to left floatand reverse the left

and right margins of the mainContent div.


You may use or modify this Dynamic Web Templates as you see fit.