Elastic grid

Mark Boulton has writ­ten a num­ber of good art­icles on design­ing with the grid system

Today’s art­icle was the one I was most look­ing for­ward to flex­ible grids unfor­tu­nately the example was a mix of fluid and elastic web design and it fell down at some font sizes. (Some of it to do with Moz­illa and how it cal­cu­lates sizes). So I cre­ated a true elastic ver­sion which much like this blog, var­ies the font size depend­ing on browser width, to cre­ate a page that fills the browser.

One Response to “Elastic grid”

  1. Matthijs Says:

    Hi Nick,
    Nice example, thanks. Unfor­tu­nate that Mark’s example isn’t work­ing due to the widths being 36.2% + 61.8% = 100%, which not all browsers like when round­ing %‘s to pixels (which you already men­tion, sorry for repeat­ing that). Too bad, cause the solu­tion is so easy, just give the divs some breath­ing room — you need gut­ters any­way. That’s one thing I always try to do, espe­cially with floats (IE!): don’t fill up every pixel of room you should have in the­ory.
    Any­way, good luck with your site Nick!

Affiliates

Google
text advertising by
Powered by Reseller Zoom