@@AlecArmbruster Okay, I can do it here: Don't bother. For 99% of websites the performance improvements aren't that important. V8 compiles your js anyways. The only reason you'd use it is if you have something specific written in the languages that can compile to WASM or you're building a really performance heavy app/game as a web app (I know the web version of illustrator/photoshop runs thanks to wasm).
I struggle when I have too many childrens with BEM practice and I only know 7 folder architecture in SASS but I think it's not perfect architecture so I'd watch this video please.
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!
Amazing. Getting straight to the point, exactly what I expect from a programmer. Just hate those TH-cam 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!
Wow! I'm a newbie in webdev, i almost finishing the colt steele course, and I'm feeling really good because I'm finally able to understand your high Quality videos, thanks for inspiring me!
I’m only 1:39 into this video.......THANK YOU!!! I’m new to coding and I’ve been trying to figure out what semantic elements were and why you would use article over doc and for whatever reason it took me until right now years old to get it.
This is BRILLIANT. I am a QA by profession, just trying out something (during the lockdown period :) ) with Ionic and Angular and your channel is really good. I think I am doing fairly ok given my constant involvement with dev team and some amount of coding myself. Any quick Angular+ionic pointers would be really helpful and appreciated :). Anyway please keep up the good work ...
For the text background clip I believe setting color to transparent also works instead of the vendor prefixes property. Not sure what if it has drawbacks though, would love your input on that if you know.
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)
Just wanted to point out that on top of using the correct html elements for semantics it also helps aid people with disabilities using screen readers. There's also aria labels and color contrasts to look out for but every bit helps :)
That gradient text trick was very nice! But can you please shout a lot of super technical words at the beginning of your next video? If you make web dev seem any easier, then our clients will end up doing it themselves! :p (Just kidding, I love the simplicity of your videos!)
I love your technical videos, but I really love more your CSS videos Thankyouu.. Oh one thing, it will be better if u just hide the file explorer in VSCode and show a little browser, also using live server for live update so we can understand each property better
Not even sure if this is exactly what I need, but it looks great so it's going into my 'to learn' playlist. Just building my second card game (first was blackjack and second is MEMORY) with card images, but I want the third one to be solitaire, so the overlapping card look is something I want to learn. Even if this isn't exactly the best method I think it'll still come in 'very handy' to use elsewhere.
Can we get a whole video about css properties like ~ which aren't widely known please :)
I like that idea 🤔
just read the freakin docs smh
@@tooru lmao fr
@@tooru Why make videos about anything then? You can just read the docs...
@@Fireship Yes, "10 CSS properties you never knew existed" there you go, :)
fireship is on fire with the content 🔥
i agree
fire fire fire fire fire fire CSS
the most high-quality videos of Software Development one can find on the internet
more videos like this please, your videos are incredible
:D this is the best channel on youtube
no doubt about it... :D
agreed
Doofenshmirtz(Web Designer): "Holding General Sibling Combinator and Smirking" At last the combinator I have been looking for.
Kmche
I love this 🤣🤣🤣
1: Web assembly
2: css /sass architecture bem etc pleasee
Yoooo WASM! Yes! Would love a WASM introduction!
@@AlecArmbruster Okay, I can do it here: Don't bother. For 99% of websites the performance improvements aren't that important. V8 compiles your js anyways. The only reason you'd use it is if you have something specific written in the languages that can compile to WASM or you're building a really performance heavy app/game as a web app (I know the web version of illustrator/photoshop runs thanks to wasm).
I struggle when I have too many childrens with BEM practice and I only know 7 folder architecture in SASS but I think it's not perfect architecture so I'd watch this video please.
@@82TheKnocKY Pretty much the answer to the WASM hype. It's nothing new, I don't understand why we need to hype it up.
Vojtěch Loskot Well I’d like to use it to encode video or something neat.
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.
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
Great video as always. Just want to point out that are inline-blocks, not inline elements.
That `~` operator is magical!
I too reverse engineered these cards a few days ago. Looks really good!
I was checking css tricks the other day and those cards caught my eye as well. Great video mate. Thanks.
I could barely name 1 content creator that is even close to your level.
You're amazing 🔥🔥🔥
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!
My God fireship is amazing, I'm digging the practical examples of lesser known css properties/selectors
I wish we had someone like you for python as well. Simply the best
Looks clean and crisp. Great video 👍
Amazing. Getting straight to the point, exactly what I expect from a programmer. Just hate those TH-cam 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!
the visualisation soo dope than ever, luv dis
First 30 seconds made me subscribe, you are awesome man.
absolutely love the content lately. Way to go FireShip!!
This is awesome. I recommend this channel to all my dev friends/colleagues, and it's surprising that not many have heard of it.
Just about a week ago I wanted to add gradient to text, thanks a lot!!!!
This is pretty simple, yet pretty sophisticated stuff. Nice!
Please do more like this! Learned a lot of CSS in this video 😎
This is awesome, so many CSS concepts in one video
Wow! I'm a newbie in webdev, i almost finishing the colt steele course, and I'm feeling really good because I'm finally able to understand your high Quality videos, thanks for inspiring me!
I have been watching your videos for long now like I am really inspired by you man keep on doing your good work I love it .....
Man this is absolutely wonderful. I learned a lot from a 9 min video. Thanks a lot!
I’m only 1:39 into this video.......THANK YOU!!! I’m new to coding and I’ve been trying to figure out what semantic elements were and why you would use article over doc and for whatever reason it took me until right now years old to get it.
Love your CSS Videos!!!
Pls make more
This is absolutely incredible!
This was awesome. So many tricks in time less then 10 minutes. Thanks a lot.
Amazing the way you explain it,simple but elegant
This was such a well done video. Please make more of these
This is BRILLIANT.
I am a QA by profession, just trying out something (during the lockdown period :) ) with Ionic and Angular and your channel is really good. I think I am doing fairly ok given my constant involvement with dev team and some amount of coding myself.
Any quick Angular+ionic pointers would be really helpful and appreciated :). Anyway please keep up the good work ...
Best content on TH-cam.
I'm glad to see you use Semantic HTML tags. I love your CSS videos! Still hoping that you'll cover Rust and WebAssembly.
Every new video is better than previous one! How do you manage to raise quality each time?
Top notch content as always. Thanks Jeff!
This is amazing !!!!! Going to use this in my portfolio
Please make a short series on all the lesser-known CSS selectors and event handling selectors.
jeff always knows what we want❤️...this video was highly needed
For the text background clip I believe setting color to transparent also works instead of the vendor prefixes property.
Not sure what if it has drawbacks though, would love your input on that if you know.
Remember to test hovering edges when changing values around with overlapping elements to avoid infinite jog|movement issues.
Wow. Other day I was amazed by CSS Tricks and here is the Tutorial. Thanks 👍.
This was a joy to code. Thank you
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)
Nice! I would love to see a SCSS in 100 seconds video
You are a genius. This needs more clicks. Commenting, to power the YT algorithm.
You could make it better accessible by using a button/link tag and using both the hover and focus selector.
As good as always! Nice work man
This is too good that I forgot I hit like the first time then watching half way through the video I hit like again lol
Wow, I think I'll use this in a personal project
Man this is cool. This should work for mobile display too if we just change flex direction to column. Gotta try this
Just wanted to point out that on top of using the correct html elements for semantics it also helps aid people with disabilities using screen readers. There's also aria labels and color contrasts to look out for but every bit helps :)
Looks awesome! Your videos always amaze me.
2:20 that clip was awesome...
Make more videos like this 👌 Thank you Jeff 👍
This is so awesome! Thank you so much!!! 😍
I can't believe this was so easy 🤯
Wow so clear. Thank you!
Great content, keep them coming!!
You are seriously Fire!!! 🔥🔥🔥
Man your content is beautiful.
Awesome video
Learnt many many many things
Amazing tutorial!!👌👍
That gradient text trick was very nice! But can you please shout a lot of super technical words at the beginning of your next video? If you make web dev seem any easier, then our clients will end up doing it themselves! :p
(Just kidding, I love the simplicity of your videos!)
Amazing, you're like a magician 😄
I love your technical videos, but I really love more your CSS videos Thankyouu..
Oh one thing, it will be better if u just hide the file explorer in VSCode and show a little browser, also using live server for live update so we can understand each property better
Amazing tutorial buddy !!!
I think I am gonna use this for my personal link archive.
I NEEEEDED THIS... YOUR NAVBAR AND FB MENU VIDEOS WERE AWESOME 🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥
I liked this tutorial so much!
I learned a lot
Thank you! 😄
You are so good. Broouh!
I hope someday soon Jeff will be recognized by his mom.
Best Channel
i love your html and css onlt tuts :*
Bro this is amazing thank you for this
Recommend using live server extension in vscode, very useful for watching the changes "live" ;)
Thank you very much for the channel, I hope the video output channel includes Vietnamese subtitles, loves the channel
because of the flexbox, the styles you are adding at 2:44 to make it scroll is not working
Not even sure if this is exactly what I need, but it looks great so it's going into my 'to learn' playlist.
Just building my second card game (first was blackjack and second is MEMORY) with card images, but I want the third one to be solitaire, so the overlapping card look is something I want to learn. Even if this isn't exactly the best method I think it'll still come in 'very handy' to use elsewhere.
I am a backend Python dev/ Cloud Engineer and 90% of it just went over my head but I still watched till the end haha...
don't worry this goes over the head of most front end devs even. Flexbox starts aging but the working force never really adapted to it.
wooow, that's really awesome!
Most Awesome Sir 👍.
good job ! thanks for sharing.
yet another dope content
I recognize the clip at 5:35! That's the inside of the Student Life Centre at the University of Waterloo
How to measure the pixels like that 6:31
TIL you can affect relative elements with pseudo classes, something I would've painstakingly done with JS events up until now.
Thanks a lot!
Amazing and really imformative
Yes! CSS Tricks 💯
Around 5:25 I don't think the animation corresponds to the one that is present in css tricks website. By the way thanks for this demo!
HE'S ON FIRE! 🔥🔥🔥
HAT TRICK!!! 🎩🧢👒
I really want tuts from this guy
Thank you!
Damn very awesome video!
You are CSS God