Issue 4
News
Issue 4
Apologies for those of you who had trouble with the email last week. An incorrect DKIM record was upsetting Gmail. I'm keeping my fingers crossed that all is well this time.
Thank you for all the great feedback on the newsletter. Don't forget to let me know if you spot or write something about layout on the web. Find me on Twitter, or just reply to this email.
CSS Layout News
Bootstrap 4 alpha
Version 4 of Bootstrap is now in Alpha. The framework has switched from Less to Sass, but the news most of interest to readers of this email is that it now includes an optional Flexbox based Grid. I've not taken a look yet, but will share my thoughts when I do.
Learn
Creating Responsive Shapes With Clip-Path And Breaking Out Of The Box – Smashing Magazine
A useful article showing how to use the clip-path property from the CSS Masking Module.
What IS Flexbox? — Medium
A nice post from Scott Vandehey detailing the history of Flexbox, and where we stand now with browser support.
Responsive Images explained
A short video explanation of Responsive Images. A really clear and quick way to get to grips with the standards and terminology around the subject.
Grid by Example - Usage examples of CSS Grid Layout
Over the weekend I added CodePen live demos to my CSS Grid Layout examples. You'll need the Experimental Web Platform Features Flag switched on in Chrome to see these in action. Each also has an image to demonstrate what it should look like.
Grid Tidbits part 3: grid track sizing
Emil Björklund has written up some details of how track sizing works in CSS Grid Layout.
Interesting
CSS element() function - Vincent De Oliveira
The element function can render any part of a page as a live image. Sound strange? Read this post to find out more and see it in action.
Our Sponsor
A CMS for front-end developers
With a simple, elegant template language that leaves you in control of your markup and CSS, Perch is a CMS that works with you and the way you want to create websites.