Skip to content

Issue 36

Microsoft Edge news, Flexbox fallbacks, and what is the difference between flexbox and CSS Grid?

Rachel Andrew
2 min read

News

Issue 36

A couple of things I am up to. I am presenting my CSS Layout workshop at Webinale in Berlin on June 2nd. You can get a 10% discount on tickets to Webinale by using my discount code web_ra at checkout.

I'm doing an AMA over at Designer News tomorrow (Wednesday 6th April). I'l be posting a thread to the site in the morning, and will attempt to answer any questions about anything raised during the day. I'd love to see some layout stuff there!

Rachel Andrew, CSS Layout News


Microsoft Edge Web Summit 2016 | Channel 9

The recordings aren't showing up on this link yet, but will be soon. At the Edge Web Summit Microsoft announced a number of things of interest to CSS developers. You can now file bugs in Edge directly at bugs.microsoftedge.com. Coming soon will be RemoteEdge to enable remote testing on Edge from any device.

The thing I'm really excited about can be found at data.microsoftedge.com. This data exposes the properties used across the web, and is how Microsoft prioritize future development. Once the videos are online you can watch Greg Whitworth talk about this data. As an example here are the number of sites using the display property, scroll down to see a breakdown of which values of display are most used.

msdn.com

Learn

Almost complete guide to flexbox (without flexbox) | Kenan Yusuf

A guide to older properties that enable you to do flexbox-like things. Useful for creating layouts for older browsers (which you might then enhance with flexbox).

kyusuf.com


Should I use Grid or Flexbox?

The most frequently asked question when I demonstrate CSS Grid Layout is, "when should I use Grid instead of Flexbox?" I wrote up an explanation of the differences between the two.

rachelandrew.co.uk


Moving from HTML Grid Systems to CSS Grid Systems

A useful article from Zell Liew which explains with lots of examples how to move from thinking about layout in terms of describing layout in markup, to describing layout in CSS. This is an important step if you want to start to use newer layout methods such as Flexbox and Grid, however can work today with something like Susy as Zell demonstrates.

zellwk.com

Interesting

State of affairs: Bootstrap 4 vs Foundation 6.2 - Danny Herran

A comparison of the latest versions of Bootstrap and Foundation, including the Grid system used in each.

dannyherran.com


Is real CSS layout finally here?

"Now, after two long decades, we have actual layout systems coming to fruition.  I’m not talking about your favorite layout framework, but about actual systems baked directly into the language, and into browsers: flexbox and grids."

oreilly.com


Laying Out the Future with Rachel Andrew

I had a chat with Jen Simmons for The Web Ahead podcast about all the new things that are coming to CSS Layout.

thewebahead.net

Our Sponsor

Become a CSS layout expert

If developing a layout seems to mostly consist of trial and error, or you are relying on a framework in order to make layouts that work, I have a course for you. Throughout this video course I'll explain the mysterious aspects of CSS, giving you a solid foundation to create the layouts you want.

Purchasing a course also gives you access to our private Slack Community, discuss the things you are learning or any problems you have with other people doing the course - and me!

thecssworkshop.com

Newsletter