CSS Card Tricks

00:00 Intro
00:36 Layout
02:55 Shadows
03:20 Scrollbar
03:55 Animation
05:30 SVG Semicircle
07:48 Gradient Text

#css #tutorial

Install the quiz app 🤓

Use code lORhwXd2 for 25% off your first payment.

My VS Code Theme

- Atom One Dark
- vscode-icons
- Fira Code Font

[shafii]

Can we get a whole video about css properties like ~ which aren't widely known please :)

[briandesign]

fireship is on fire with the content 🔥

[shriyamtripathi]

the most high-quality videos of Software Development one can find on the internet

[fire_boat]

:D this is the best channel on youtube

[abcdefg-nuxj]

more videos like this please, your videos are incredible

[dorktales]

Doofenshmirtz(Web Designer): "Holding General Sibling Combinator and Smirking" At last the combinator I have been looking for.

[muhammadsami]

1: Web assembly
2: css /sass architecture bem etc pleasee

[helix]

Legit I used to get inspired by the csstricks website so much

And today one of my favourite channels covered it

Nothing could be much better rn

[iamfirdous]

What I did not learn in my 3 years career,
I learned it in an 8-minute video.
That's a great effort you putting there.

[srijans]

I too reverse engineered these cards a few days ago. Looks really good!

[Glavin]

My God fireship is amazing, I'm digging the practical examples of lesser known css properties/selectors

[TopBagon]

I wish we had someone like you for python as well. Simply the best

[vag]

I was checking css tricks the other day and those cards caught my eye as well. Great video mate. Thanks.

[kendedetar]

I could barely name 1 content creator that is even close to your level.
You're amazing 🔥🔥🔥

[nivlempert]

Amazing. Getting straight to the point, exactly what I expect from a programmer. Just hate those YouTube programming channels who think I’m there watching to hear about their daily life and make jokes with them, not to mention the 3 minutes preview of “what their going to talk” about on the video which is of course stated on the fucking title and by the end would be covered entirely if their kept their mouth shut and got straight to work.

Thank you!

[gabrielbatista]

Great video as always. Just want to point out that <img> are inline-blocks, not inline elements.

[iLikeMyOwnPosts]

Thank you, I absolutely love the code-along style. Not only helps to get down the aspects, but while coding I can make small adjustments and end up with an end result that I can use in my own applications. Thanks, again!

[jouebien]

You could make it better accessible by using a button/link tag and using both the hover and focus selector.

[ronitrajput]

First 30 seconds made me subscribe, you are awesome man.

[Dexteritye]

If anyone was wondering why he set .card to position relative, it’s because position relative makes sure the cards stack (a div that is declared after another div in html can stack over it)