CSS clip-path, Flexbox examples and the return of 24 Ways.
A mixed bag of links and resources this week from an interesting clip-path generator, flexbox for pricing tables and comments, to the launch of the latest version of the Foundation framework.
I hope that those of you taking a break to celebrate Thanksgiving this week have a relaxing time with friends and family.
Rachel Andrew, CSS Layout News
Foundation 6 Is Here! | ZURB Blog
The latest version of the Foundation framework is here. It includes a Flexbox Grid although I haven't had chance yet to dig into it and see how it behaves.
Web design and development articles and tutorials for advent ◆ 24 ways
On the 1st of December 24 Ways will be back for another season of articles on web design and development. You can read all of the past articles on the site in anticipation for what I'm sure will be another great year!
Using Flexbox to Create a Responsive Comment Section | Tutorialzine
A walkthrough showing how to use Flexbox to create a Responsive Comments section.
Some Inspiration for Pricing Tables | Codrops
Some lovely examples of pricing tables using Flexbox. Make sure you check out the demos.
Full Screen Navigation overlay example and tutorial
Something that is popular at the moment is a navigation overlay, and here is a nice tutorial and demo showing one method of creating these.
Panda Strike: Taming Flexbox
A post that talks about "taming Flexbox" with a Stylus Helper function. An interesting idea to try and map the concepts to something you understand although I am concerned about this tendency to outsource our understanding to these frameworks. It's one thing if you are the person creating the framework, but then as it gets passed on the next person doesn't have the underlying knowledge.
Clippy — CSS clip-path maker
A CSS clip-path generator, a useful tool for working with complex shapes in CSS.
A CMS that will work with you
Perch has a template system that is HTML-like, simple to use and gives you full control of your mark-up. Use Foundation, Bootstrap or your own CSS. Design and develop the way you want to, knowing that Perch has you covered for functionality when it comes to editing the site.
CSS Layout News Newsletter
Join the newsletter to receive the latest updates in your inbox.