Raclette Container

- 3 stories (first boosted)
- 6 stories behind a show more

![screen shot 2014-08-11 at 17 45 19](https://cloud.githubusercontent.com/assets/85783/3879333/a7346ed2-2177-11e4-8b57-2fcb6ab80b01.PNG)

![screen shot 2014-08-11 at 17 45 30](https://cloud.githubusercontent.com/assets/85783/3879334/aa0dc59a-2177-11e4-99e7-8dc59c7947fc.PNG)

![screen shot 2014-08-11 at 17 45 40](https://cloud.githubusercontent.com/assets/85783/3879337/ac394e0c-2177-11e4-8845-dc9607e15d26.PNG)

![ ](https://lh3.googleusercontent.com/-LMuYqlpCzPs/UMisLhv02VI/AAAAAAAAHdY/QfqKz6RD6sQ/w800-h800/photo.jpg)
Sorry if that's a bit confusing, here's how it works:
- in IE8 and IE9, `$browser-supports-flexbox` is set to false
- in the default stylesheet, `$browser-supports-flexbox` is set to true

Since these are using simple horizontal rows (no need for `flex-wrap`), we can support all browsers we serve the default stylesheet to, **on tablet and up**.

**On mobile** we should probably use the `@supports` technique (see [_row.scss](https://github.com/guardian/guss-layout/blob/master/_row.scss#L103 if you want to propose a PR). But Firefox < 28 is not big on mobile so that's why I did not bother.