Difference between pure-g and pure-g-r

Question

I wanted to ask what is the difference between pure-g and pure-g-r .I used to think that the responsive will make my div not collapse in lower resolutions but using pure-g also helped me achieve the same ,so I was confused as to what is the correct difference between them.

[just to mention I was testing using the mozilla's responsive view]

Also adding to this doubt I have seen many blogs mentioning pure classes eg:pure-mobile.. for making your website responsive for mobile,tablets etc . but I couldn't find any description in their own http://pure.css.io site.

Answer 1

With pure-g class your pure-u-* columns won't collapse.
With pure-g-r, your pure-u-* columns will collapse when viewport is < 768px.

Demo: http://jsfiddle.net/jgvE4/

UPDATE: if you are reading this today and using PureCSS 0.5+ the answer above is not valid anymore