2010-12-27

Some links about CSS layout

Three Column Stretch : strech isn’t that good, makes too long lines for main text.

Piefecta – A superb 3-col tableless layout – long right col looks good on Safari and zooms well. Tells it deals with various browser bugs. Probably the finest piece of engineering but too many fixes are making it unreadable. We don’t care about supporting IE6. License: unknown.

CSS Fixed Layout #3.1 (Fixed-Fixed-Fixed) zooms correctly. Much simpler. License: unknown.

Elastic-fluid hybrid got it right. It scales up and down in with, staying in fixed limits. Read author’s comments .

Also check this tutorial about elastic layout.

The Holy Grail 3 column Liquid Layout has great explainations. (Only 1 error on W3C validator but the element reported to be missing appears as it should – validator bug?) License: free to use, linkback appreciated. After a close look, it turned out that forcing min-width and max-width for the column (worst case: nesting another div) and using proper text alignment does the job.

No comments: