Elastic grid

Mark Boulton has written a number of good articles on designing with the grid system

Today’s article was the one I was most looking forward Why to flexible grids unfortunately 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 Mozilla and how it calculates sizes). So I created a true elastic version which much like this blog, varies the font size depending on browser width, to create a page that fills the browser.

One Response to “Elastic grid”

  1. Matthijs Says:

    Hi Nick,
    Nice example, thanks. Unfortunate that Mark’s example isn’t working due to the widths being 36.2% + 61.8% = 100%, which not all browsers like when rounding %’s to pixels (which you already mention, sorry for repeating that). Too bad, cause the solution is so easy, just give the divs some breathing room – you need gutters anyway. That’s one thing I always try to do, especially with floats (IE!): don’t fill up every pixel of room you should have in theory.
    Anyway, good luck with your site Nick!