Layout

How do you position elements on the screen?

Grid
Completion percentage: 94.9% (10906)
Completion percentage: 94.9% (10906)

Export
Percents%
CountΣ

2019

2020

استفاده کردم
میشناسمش
تا حالا نشنیدم

Subgrid
Completion percentage: 94.5% (10859)
Completion percentage: 94.5% (10859)

Export
Percents%
CountΣ

2020

استفاده کردم
میشناسمش
تا حالا نشنیدم

Flexbox
Completion percentage: 94.6% (10871)
Completion percentage: 94.6% (10871)

Export
Percents%
CountΣ

2019

2020

استفاده کردم
میشناسمش
تا حالا نشنیدم

Multi-Column Layout
Completion percentage: 94.3% (10837)
Completion percentage: 94.3% (10837)

Export
Percents%
CountΣ

2019

2020

استفاده کردم
میشناسمش
تا حالا نشنیدم

Writing Modes
Completion percentage: 94.5% (10855)
Completion percentage: 94.5% (10855)

Export
Percents%
CountΣ

2019

2020

استفاده کردم
میشناسمش
تا حالا نشنیدم
We asked members of the CSS community to share their “pick of the year”

My 2020 Pick: Container Queries

Container queries are a long-time awaited feature for us, and I’m thrilled that the Chrome team is working on support for it natively!

We asked members of the CSS community to share their “pick of the year”

Ahmad Shadeed

Author of debuggingcss.com

Exclusions
Completion percentage: 94.2% (10830)
Completion percentage: 94.2% (10830)

Export
Percents%
CountΣ

2019

2020

استفاده کردم
میشناسمش
تا حالا نشنیدم

CSS position:sticky
Completion percentage: 94.4% (10853)
Completion percentage: 94.4% (10853)

Export
Percents%
CountΣ

2020

استفاده کردم
میشناسمش
تا حالا نشنیدم

CSS Logical Properties
Completion percentage: 94.3% (10837)
Completion percentage: 94.3% (10837)

Export
Percents%
CountΣ

2020

استفاده کردم
میشناسمش
تا حالا نشنیدم

CSS property: aspect-ratio
Completion percentage: 94.5% (10855)
Completion percentage: 94.5% (10855)

Export
Percents%
CountΣ

2020

استفاده کردم
میشناسمش
تا حالا نشنیدم

CSS content-visibility
Completion percentage: 94.5% (10865)
Completion percentage: 94.5% (10865)

Export
Percents%
CountΣ

2020

استفاده کردم
میشناسمش
تا حالا نشنیدم

Recommended Resources

CSS Grids and Flexbox for Responsive Web Design

Starting with a review of floats for context, but quickly moving into Flexbox and CSS grids, this essential course is for web developers that want to build responsive, beautiful web applications faster using less code and best practices.
Thanks to our partners for supporting us! Learn more.