Columns in CSS

In CSS 2, it is not possible to create equal height boxes. There are six possible solutions to use columns in HTML.

Use HTML tables
Use HTML tables to created

pro: it works con: it is considered a HTML hack

Use CSS columns
http://www.w3.org/TR/css3-multicol

pro: Perfect solution. Allows for automatic overflow of text between columns (unlike all other methods) con: Hardly supported (it's not a standard yet, though the draft dates from 2001)

Use fixed height CSS boxes
Use fixes sized boxes to position each individual column

e.g. http://www.alistapart.com/articles/multicolumnlayouts and the sites it links to.

pro: produces clean CSS. Allows floats spanning multiple columns con: you need to estimate the height of the text, and thus can't use a variable width

Use Background images
http://www.alistapart.com/articles/fauxcolumns/

pro: Works in most browsers. Actual box does not extend (only the background image), so can't use all CSS con: it is considered a hack.

Use CSS tables
http://moronicbajebus.com/playground/cssplay/equalcolumn/files/

pro: Just as good-looking as HTML tables con: Does not work with Internet Explorer 7 or below. Considered a hack (it's still a table, though you do seperate content and layout). Can't reorder position of columns in CSS.

Use a container div for each column
http://matthewjamestaylor.com/blog/equal-height-columns-cross-browser-css-no-hacks

pro: Very flexible; works in the nearly all situations without hacks con: More complicated to set up and requires some non-semantic div tags

Use negative margin
http://positioniseverything.net/articles/onetruelayout/equalheight and http://www.redmelon.net/tstme/3cols2/

pro: produces good visual results, with CSS only. con: considered a CSS hack. Need additional hacks for IE, Safari, Netscape, Opera.

Use Javascript to resize CSS boxes
http://www.paulbellows.com/getsmart/balance_columns/ and http://www.projectseven.com/tutorials/css/pvii_columns/

pro: produces clean CSS. con: relies on Javascript and proper implemented DOM. Debugging is harder.