library-mirrors/pure
1
0
Fork 0
mirror of https://github.com/pure-css/pure.git synced 2024-10-05 19:24:19 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Preventing grids distributing verticle space

Browse Source 
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.
This commit is contained in:
Chao 2014-12-30 13:29:05 +00:00
parent e5fd3d2dac
commit 0833fe802c
1 changed files with 5 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/grids/css/grids-core.css
View File

@ -37,6 +37,11 @@
/* IE10 uses display: flexbox */ /* IE10 uses display: flexbox */
display: -ms-flexbox; display: -ms-flexbox;
-ms-flex-flow: row wrap; -ms-flex-flow: row wrap;
/* Prevents distributing space between rows */
-ms-align-content: flex-start;
-webkit-align-content: flex-start;
align-content: flex-start;
} }
/* Opera as of 12 on Windows needs word-spacing. /* Opera as of 12 on Windows needs word-spacing.