The specification describes a CSS box model optimized for user interface design. In the flex layout model, the children of a flex container can be laid out in any direction, and can “flex” their sizes, either growing to fill unused space or shrinking to avoid overflowing the parent.

flexbox

Cascading Style Sheets bring order and beauty to our applications.

This playlist covers various aspects of CSS including different rules, selectors, and patterns

We show what difference the CSS rule box-sizing border-box makes to your applications before showing the best way to apply border-box to your entire application while preserving the ability to render legacy components

Understanding box-sizing: border-box

When stacking multiple HTML elements with margins, those margins collapse into each other which can lead to surprising behavior if you're not expecting that.

CSS Margins Collapse

The `:empty` pseudo selector selects empty elements. We can use this to display useful messages instead of the empty content or hide the content completely. However, the `:empty` pseudo selector comes with a couple of potentially confusing behaviors when it comes to which elements it considers empty.

CSS Tips and Tricks

Chris Biscardi

Course Content