Layout
Layout tools are one of the areas that have seen the most changes in recent years. First Flexbox came onto the scene, and then CSS Grid emerged as the most polyvalent and expressive way of handling CSS layouts.
It may take a little longer to master, which explains why a lot of users haven't actually used it, but it's certainly worth the effort!
Usage Overview
The size of the outer circle corresponds to the total number of users who know about a feature, while the inner one represents those who have actually used it.
Hover on each node to view detailed data along with an overlay representing the total number of survey respondents.
Usage by Years Of Experience
The “overall” column shows overall usage for each feature (respondents who selected “have used it”), while the following columns show the usage ratio for each “years of experience” bracket.
A brighter pink background indicates a higher-than-overall-average ratio for a given bracket.
Grid
CSS Grid Layout excels at dividing a page into major regions or defining the relationship in terms of size, position, and layer, between parts of a control built from HTML primitives.
Learn More
Flexbox
CSS Flexible Box Layout is a module of CSS that defines a CSS box model optimized for user interface design, and the layout of items in one dimension. 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. Both horizontal and vertical alignment of the children can be easily manipulated.
Learn More
Multi-Column Layout
CSS Multi-column Layout is a module of CSS that adds support for multi-column layouts. Support is included for establishing the number of columns in a layout, as well as how content should flow from column to column, gap sizes between columns, and column dividing lines (known as column rules) along with their appearance.
Learn More
Writing Modes
CSS Writing Modes is a CSS module that defines various international writing modes, such as left-to-right (e.g. used by Latin and Indic scripts), right-to-left (e.g. used by Hebrew or Arabic scripts), bidirectional (used when mixing left-to-right and right-to-left scripts) and vertical (e.g. used by some Asian scripts).
Learn More
Exclusions
An exclusion element is a block-level element which is not a float, and generates an exclusion box. An exclusion element establishes a new block formatting context (via Chen Hui Jing).