When there's a grid container of a defined height excess vertical space gets distributed across the rows rather than allowing each row to take up its natural height [see this fiddle](http://jsfiddle.net/ambekpdm/). As grids are used for horizontal positioning it's pretty counter intuitive to come across it affecting vertical distribution. This can be fixed by adding `align-content: flex-start` to the element with the `pure-g` class.
Not sure if this is something best fixed by adding this style in to Pure itself or something to highlight on the site along with the box-sizing notes. But considering it causes significantly different behaviour in browsers without flexbox I'd consider this to be the best place.
We'll be using [rework-pure-grids][1] to generate responsive
grids on a per-app basis. This is more useful than having
.pure-g-r inside Pure's `src/` since media queries cannot
be over-written.
[1]: https://github.com/ericf/rework-pure-grids
- Remove DejaVu Sans since it doesn't work with the letter spacing.
- Replace Bitstream Charter with Freesans, a sans-serif alternative.
- Replace Tinos with Arimo, a sans-serif alternative.
Based on conversations in https://github.com/yui/pure/issues/41/,
this font stack was updated with more fonts to fully cover all
target environments where grids were breaking.
By setting _specific_ font stacks grids, it can be assured that the
letter and word spacing will be applied correctly. The font stack for
grid units is then set back to `sans-serif`, which is also the default
font stack that Normalize.css applied to the `body`.
Closes#41
After thinking about it, it makes sense to just keep
these as .pure-u-* to preserve back-compat and so that
people don't get confused with the fact that these units
are the "default" units.
* `-core.css`: The module's most basic functionality.
* `[module].css`: The module's main rules, assumes `-core.css` rules.
* `-context.css`: A contextualized version of `[module].css`.
* `-r.css`: Respnsive, `@media` query rules.
* `-[feature].css`: Optional feature that provides extra rules.