Top 10 CSS Features You Should Know & Use in 2023

This video is about the Top 10 CSS Features you should know and use in 2023.
I'm pretty sure that you don't know all of them - but you definitely should. They will help you to write better code.


=== [ LIKE & SUBSCRIBE ] ===

Please LIKE the video if you enjoyed it and
SUBSCRIBE to the channel for more videos like that.



=== [ VIDEO CHAPTERS ] ===

00:00 – Intro
00:22 – clamp
02:15 – smooth
03:36 – Scroll Snap
06:33 – inset
08:43 – order
11:19 – inline, block
13:40 – min, max
15:37 – line-clamp
16:57 – has (pseudo-class)
17:53 – is (pseudo-class)
19:41 – Outro

Tell me in the comments which of those features are your favorites, which of those did you already knew or which one’s are definitely missing here.
#css #csstricks #css2023

[lukas.webdev]

Which of those features are your favorites, which did you already knew or which one’s are definitely missing here? 🧐
I would love to get your take on this ranking! 😉🔥

[JohnKumarBuses]

Industry practice or best practice.
1. Best practice for body copy in responsive design.
2. Best practice for header and footer.
3. Best practice for components like cards etc.
a complete guide would be great. I think you have the deep knowledge. You could help millions of UI designers.

[PabloGAller]

Thanks a lot Lukas. I have finally understood :is(), inline vs block, and how to use line-clamp. And I love your style! 👏👏👏👏👏

[DanielRios]

Oh my God, I simply didn't know the scroll-snap, I already need to use this but I didn't know how, this is amazing, every day being impressioned by the amazing features of CSS

[Omkar-qv]

U suddenly appeared on my utube and cleared my all doubts which bother me everyday ❤️‍🔥❤️‍🔥

[dmitrynesterov]

You’re teaching at the exactly the pace that is needed to understand and memorise . Works really well for me

[grantseguisa]

Never rlly realized till now that am missing out alot on easier code writing. Ive been using notepads to qrite codes 😂. Vscode seems alot easier to use

[avavijit]

Thank you so much, Sir 🙂
I am really inspired by your video🙏❤🙏

[HandyDelisma]

In the second tip.can we use transition?

[kmehour]

Quick question, how do you scroll horizontally ? do you just use your (vertical) scroll wheel, or do you use a modifier key ?

[gideonmomah]

Did u just fuckin call me a code money
This better be worth it

[CPython]

Why typing all those letters when you can use abbreviations:
For width just press w and enter px value and is done.
h: height
df:display-flex, etc..

[clevermissfox]

Whats the difference between display: flex; and display: flexbox; ?

[himanilsharma]

Speed, pace, way of telling, simplicity and easy to understand - if those were the categories to rate this video then I will rate 100 out of 10...!
You just lighten up the areas where I was afraid of going due to darkness... Thanks 🙏

[ColinRichardson]

17:37 you seem to have a booboo here.
You are not targeting .items you are targeting .containers that has .items

[wg]

i was first offended by the code monkey remark, then i was like yeah that is what is actually happening (especially at a junior dev level), touché lukas touché

[jonopens]

Really great video, Lukas! It would be even better if you have a better mic as the vox come through kind of echoey/tinny. Content is excellent, however - keep it up!

[guswin]

Hey man the video is really amazing; I hope to see more about the CSS features in the future. really simple but really easy to understand. Thanks for the video, man. can't wait to try it myself.

[VXTivkot]

HELLOW TEACHER WHATS THE TRANSFORM_ORIGION I AM SORRY I ASK A LOT OF QUESTIONS BECAUSE I AM A NEW

[oliver]

11:19 Emmm, not 100% correct, where inline ≠ left & right and block ≠ top & bottom. This is only true if your writing mode is horizontal. If it is vertical, they become opposite then.