Use Absolute Positioning to Create Equal Columns

There are many, many ways to create equal columns with CSS. This is one of those features that was MUCH simpler to achieve back in the days of html tables. In the next couple of years, when the use of CSS tables becomes more reliable, we won’t have this problem anymore. (For more information, watch this video.)

I betcha didn’t know that there is a neat way to create equal columns by using absolute positioning. Will this be applicable for all scenarios? Absolutely not. But, it’s a nice trick to have in your tool box!

Equal Columns With Absolute Positioning

Be sure to import the following script for your IE6 users. It will save you many headaches! 

<!--[if lt IE 8]>
<script src="http://ie7-js.googlecode.com/svn/version/2.0(beta3)/IE8.js"
type="text/javascript"></script>
<![endif]-->

39

Comments

Jeffrey

Hi, I'm Jeff. I'm the editor of Nettuts+, and the Site Manager of Theme Forest. I spend too much time in front of the computer and find myself telling my fiance', "We'll go in 5 minutes!" far too often. I just can't go out to dinner while I'm still producing FireBug errors...drives me crazy. I love jQuery, PHP, MYSQL, CSS, AJAX - pretty much anything.