Modern Layouts with Flexbox, Grid, Calc, and Custom Fields

Jen Kramer (12.Nov.2018 at 09:00, 8 hr )
Workshop at php[world] 2018 (English - US)

Rating: 5 of 5

For the first time in the history of the Web, CSS is graced with tools for laying out web pages without hacks. Flexbox and Grid have made a tremendous impact on the industry, providing methods able to create responsive websites with designs not previously possible. CSS Calc and CSS Custom Fields give us a first chance to use math and variables within CSS itself, without requiring compiling. Together, these four new CSS modules work together to revolutionize CSS in modern evergreen browsers. In this workshop, you will master the following: - Flexbox, the appropriate layout tool for repetitive units of content (like an image gallery or a series of media objects) - Grid, the appropriate layout tool for two-dimensional designs (like the overall design of a web page) - CSS Calc, a method for running math in CSS which runs in the browser - CSS Custom Fields, also called CSS Variables, which can be used in interesting ways to streamline CSS code. Students will leave with a working understanding of creating custom responsive designs with the latest tools for layout, using semantically correct HTML markup and the latest CSS modules.

Who are you?

Claim talk

Talk claims have been moved to the new Joind.in site.

Please login to the new site to claim your talk

Want to comment on this talk? Log in or create a new account or comment anonymously

Write a comment

 
Please note: you are not logged in and will be posting anonymously!
= zero plus eight

Comments

Rating: 5 of 5

13.Nov.2018 at 14:42 by Ryan Howe (28 comments) via Web2 LIVE

There was a lot of great information and it was presented very well and clearly with great workshops and examples. Everything was well organized with a lot of additional resources to review during and after the presentation. Flexbox and grid are now solid concepts for me to utilize.

© Joind.in 2018