Learn Flexbox CSS in 8 minutes

  Рет қаралды 1,720,215

Slaying The Dragon

Slaying The Dragon

Күн бұрын

Пікірлер: 1 300
@slayingthedragon
@slayingthedragon Жыл бұрын
🚨🚨🚨 New CSS Course - slayingthedragon.io 🚨🚨🚨
@smaransure2234
@smaransure2234 10 ай бұрын
How old are you
@AMINCODE7
@AMINCODE7 10 ай бұрын
😂😂​@@smaransure2234
@Filaxsan
@Filaxsan 7 ай бұрын
Oustanding! Looking fw your other courses as well!
@fartlander
@fartlander Жыл бұрын
This is what high value content looks like. Crystal clear, concise and to the point. Much appreciated.
@slayingthedragon
@slayingthedragon Жыл бұрын
Thank you ❤❤
@ishwarsukheja
@ishwarsukheja Жыл бұрын
Completely 💯 Agree
@sdbadik
@sdbadik 11 ай бұрын
I completely agree with you, @fartlander
@sncaterd
@sncaterd 5 ай бұрын
minus the annoying random white strings that were added for visual effect...they are extremely distracting
@irun_mon
@irun_mon Жыл бұрын
this is so much better than spending a whole day reading flex box in w3school, I'm a visual learner so this helps a lot
@slayingthedragon
@slayingthedragon Жыл бұрын
I'm glad this helped 😁
@finyx
@finyx Жыл бұрын
Same bro😑 plus, he also give out plenty of tips. I'm glad I came across his channel.
@shortislife6627
@shortislife6627 Жыл бұрын
Dont use w3, better use mdn
@Troyzhen
@Troyzhen Жыл бұрын
Same!
@psy237
@psy237 Жыл бұрын
u people are no visual learners, you're just lazy... there's a difference ;) but keep up the excuses, we're a society made of excuses, so you'll need it
@utkarshmayur6344
@utkarshmayur6344 2 жыл бұрын
I had skipped flexbox and moved onto learning JS; after watching this I realise how much of a peasant I was. Your channel is insane, keep the good work up!
@slayingthedragon
@slayingthedragon 2 жыл бұрын
Haha I love it, thank you so much !
@raidgamer3537
@raidgamer3537 2 жыл бұрын
Omg i did the same thing 😅
@ShineeM3
@ShineeM3 Жыл бұрын
Me too, i Just learnt it 😂
@iamaryasharma
@iamaryasharma Жыл бұрын
😂🤣
@vladrileynavilys
@vladrileynavilys Жыл бұрын
You peasant!
@hex_1733
@hex_1733 2 жыл бұрын
Beginner in CSS here, I understood how flexbox worked and the properties before, but I just couldn't wrap my head around it when it came to actually using it. This is a really clean refresher, I'll save it to watch when I get confused with flexbox again haha.
@Bregylais
@Bregylais 11 ай бұрын
Dude. .... Seriously. This one sets the gold standard for any tech-tutorial out there.
@pucksheet4456
@pucksheet4456 Жыл бұрын
very direct explanation with no bullshit words that makes non English speaker confused
@buzzardb
@buzzardb Жыл бұрын
I learned everything back in the float era and have been trying to catch up with the times. This is by far the most clear and concise flexbox tutorial ive watched yet.
@geovaniraffaelli4508
@geovaniraffaelli4508 Жыл бұрын
For someone who previously wrote css with float learning flexbox is like the best day ever
@TheronGBurrough
@TheronGBurrough 8 ай бұрын
I think you're going to be receiving these compliments until you die. Your presentation is so clear that I understood the whole thing on the first viewing.
@UndeadSasuke34
@UndeadSasuke34 Жыл бұрын
Even though I have worked as a fullstack dev for a couple of years, I never really fully understood the baseline and the align-content, even after research. It's totally absurd how you explained them in a matter of seconds at such high quality. At my company I am responsible for providing frontend learning materials for the interns every year, and this video together with others and for sure a lot of videos you will put out in the future will be the new learning material for the interns, and as well for seasoned developers, as I am spreading the word of your channel through my company and to my friends.
@slayingthedragon
@slayingthedragon Жыл бұрын
Wow thank you so much ❤️❤️❤️❤️❤️
@TheOceangirl28
@TheOceangirl28 9 ай бұрын
which is yyrrurr company
@alxbenjamin
@alxbenjamin 10 ай бұрын
No fluff, just straight to the point. We need more tutorials like this.
@stea27
@stea27 Жыл бұрын
All I can say is you nailed it again. In a few minutes you showed the whole thing, with clear instructions. You're doing a much better and useful presentation than most of paid courses and materials.
@slayingthedragon
@slayingthedragon Жыл бұрын
Thank you so much ❤❤❤
@AchyutJagini
@AchyutJagini Жыл бұрын
can u share the code of styles.css
@Alexander_Haplington
@Alexander_Haplington 8 ай бұрын
Thank you so much! Up to this point I was always confused by flexbox layout and never understood what all those articles were talking about. This was crystal clear for me!
@bamas_1357
@bamas_1357 7 ай бұрын
Our school teacher showed us this video in class, now I am coming back because we have an test on this topic tomorrow :)
@smokinjoe3000
@smokinjoe3000 Ай бұрын
holy sh-. this is the definitive video on understanding flexbox css properties - outstanding stuff
@miajowayuyu7273
@miajowayuyu7273 Жыл бұрын
love how the most watched moment is where he shows the base styles he said we should "ignore"
@DavidGraciano-xz5iu
@DavidGraciano-xz5iu 2 ай бұрын
Yeah if you ignore that this wont look the same AT ALL. lol. Its totally screwing me up as a new programmer.
@JimmyCrackorn
@JimmyCrackorn 2 ай бұрын
I love how you broke everything down into deep detail, making it a lot easier to understand - especially when you have live update active so that we can see what you're describing.
@anton9410
@anton9410 2 жыл бұрын
pretty good refresher, keeping the viewer engaged with actual info that flows from one point to another. Keep at it mate!
@slayingthedragon
@slayingthedragon 2 жыл бұрын
Thank you 🙂
@keithdeklerk7304
@keithdeklerk7304 6 ай бұрын
I've been struggling with flexbox until now. Your video certainly does what you set out to do....help us UNDERSTAND. Thanks so much!
@asaduzzamansunam9845
@asaduzzamansunam9845 2 жыл бұрын
The way you described how one property unlocks other properties (eg: flex-wrap:wrap; unlocks align-content) just blew my mind. The way you divided flex properties into container and item properties, that was brilliant. Thanks for the clear-cut video. I will recommend your video to my other friends.
@slayingthedragon
@slayingthedragon 2 жыл бұрын
Holy, I really appreciated reading that, thank you so much 😁
@matthewlay4939
@matthewlay4939 4 ай бұрын
Video was short yet super informative. I’d say that this is the most informative video on CSS that I’ve seen so far…You also make it a point to not add any fluff to your videos, again straight to the point…The way you’re able to present your teachings is done in such a way where people like me (I have very little coding experience) am able to learn deep rabbit hole topics in a very short amount of time! Thank you!
@mailsiraj
@mailsiraj Жыл бұрын
This is the 3rd video I am watching and I am very impressed with how much you convey in such a short time. For the first time, I understand the difference between align-items vs align-content. Your explanation of baseline and align-self were very helpful as I could not understand them after doing other tutorials. Thank you so much.
@maple-yf5tp
@maple-yf5tp Жыл бұрын
YOU SAVED MY LIFE!!! I would not have been able to finish my computer science culminating assignment without this
@ΜάρκοςΣουχλακης
@ΜάρκοςΣουχλακης 6 ай бұрын
Straight to the point with simple and understandable examples. Thanks man
@ivangutowski
@ivangutowski 5 ай бұрын
I was up at night stressing about uni work and not understanding all the written content... your video was so concise, clear and visually made complete sense. I could pause / go back when I needed, so the density was appreciated so that every second was valuable. Within 15 minuets I went from having no idea how to do my work, to being confident that sure.. I can totally do this. Stunning, absolutely insane ! Thank you for taking time out of your life to create this masterpiece
@Channel101india
@Channel101india Жыл бұрын
Great explanation. I was totally confused about this and was using the stone-age properties.. i feel confident now
@Website_TV_1
@Website_TV_1 2 ай бұрын
Wow, this tutorial was incredibly efficient! In just 8 minutes, I gained a clear understanding of Flexbox, which I've been struggling with for a while. The visual examples made everything so much easier to grasp. Definitely subscribing for more concise and useful content like this! 🙌 Keep up the great work!
@martinkobimbo8090
@martinkobimbo8090 Жыл бұрын
Took a whole day reading about flexbox on various sites and couldn't piece together what was happening, you just explained everything I covered and made me understand everything in 8 minutes 😮. You are the best ❤
@SirNecromaniac
@SirNecromaniac 16 күн бұрын
I watched atleast 5videos about css basic tutorial and yours is top tier, Good job. This vid is recommendable.
@RikThePixel
@RikThePixel 2 жыл бұрын
I really am liking this kindof analytical format. This guy has nice visuals paired with a pretty streamlined explanation!
@slayingthedragon
@slayingthedragon 2 жыл бұрын
Thank you very much ☺️
@webunveilers
@webunveilers Жыл бұрын
great toturial to understand flexbox in a less time
@thiscris_
@thiscris_ Жыл бұрын
As a senior developer with over 12 years of experience I can say that you are amazing at explaining. I enjoyed this quick refresh. Keep it up!
@shanoof
@shanoof 11 ай бұрын
where are from?
@DennisdeJong
@DennisdeJong 6 ай бұрын
The ultimate impatient coder speedrun for flexbox tuts. love it!
@tamarasurnina_renovation
@tamarasurnina_renovation Жыл бұрын
Thank you so much! your short video helped me understand the topic, that i've studied in IT school for 2 months and still couldn't wrap my head around it, until now! and all in 8 minutes! Brilliant!
@cjproductions5017
@cjproductions5017 Жыл бұрын
I was introduced to flexbox yesterday and I just could not get my head around it and was pulling my hair out. This video was so clear and has really helped me understand, so thank you very much!
@recep36
@recep36 Жыл бұрын
Thank you so much! I'm currently learning CSS and you've put so much content into just 8 minutes. Incredible!
@maiaayaaoo7
@maiaayaaoo7 Жыл бұрын
The best tutorial of flexbox on youtube.
@Jakobokun
@Jakobokun 2 жыл бұрын
This is gold! Been struggling to wrap my head around flexbox but this really helped me to understand it better! Subscribed :)
@slayingthedragon
@slayingthedragon 2 жыл бұрын
I'm glad I could help ! Thank you ☺️
@TheDigitalCraftManYT
@TheDigitalCraftManYT Сағат бұрын
I just watched two of your videos right now, and i must say you are totally amazing! No one would watch your videos without having an apt understanding and answer to their questions I couldn’t hesitate to subscribe ❤️
@djrmarketing598
@djrmarketing598 Жыл бұрын
I've been writing HTML since the early 90's (Mosiac days) and never understood the flex layout. Your video helped me understand this way better than I have ever understood. 100% recommended watch. Gone are the days of me trying to do margins and wrapper containers trying to center something horizontally or vertically!
@slayingthedragon
@slayingthedragon Жыл бұрын
I'm really happy to read this ☺️, much love ❤️❤️
@Edwins1984
@Edwins1984 2 ай бұрын
I skipped from floating content to .JS and other related front-end solutions.... Just hopping back into flexbox and this content is solid gold. Well done man
@nemeziz_prime
@nemeziz_prime 2 жыл бұрын
I cannot express in words how brilliant this tutorial is 👏🏻👌🏻🔥
@slayingthedragon
@slayingthedragon 2 жыл бұрын
Thank you 😁
@Jaberty
@Jaberty 7 ай бұрын
Thanks for this great explanation!
@rookie6496
@rookie6496 2 жыл бұрын
Sick summary! Loved it, I have always needed align-self, but didn't know it existed. Deserves waaay more views.
@slayingthedragon
@slayingthedragon 2 жыл бұрын
Thank you ☺️
@shorts9900
@shorts9900 Жыл бұрын
everytime I think I know everything about css I see your video and learn something new
@slayingthedragon
@slayingthedragon Жыл бұрын
Much love ❤️❤️
@abhavyaverma5101
@abhavyaverma5101 Жыл бұрын
This is what I was looking for. Direct and simple explanation. Great Work 😄
@slayingthedragon
@slayingthedragon Жыл бұрын
Thank you 😊😊❤❤❤
@Juiixe
@Juiixe 5 ай бұрын
Amazing video!! It really helped me to understand the how flexbox works
@jamesfranchino
@jamesfranchino Жыл бұрын
Such a good explanation. Simple and no waste of time. A true professional!
@betraid
@betraid Жыл бұрын
Very useful video thank you, not like 80% of youtubers making "tutorials" or whatever with hidden code parts until you forced to pay them which is called "support", for the complete version or if refuse to pay , you just wasted your time. Thank you again for videos like this to be free, true content, no garbage.
@Blackoutfor10days
@Blackoutfor10days Жыл бұрын
There's a huge demand of teachers like you 😊
@Awpsun
@Awpsun 4 ай бұрын
I was struggling so much with flex-box even after watching so many videos on it but this video finally helpedd. I'm so glad I clicked on this video after it was recommended my 100s of times. Thankyou so much no one explained me flexbox in this way as axis, it's so easier to grasp with the understanding of graphs. I'll checkout your channel, you're goated. thanks a lot man. :)
@afterthelasttime
@afterthelasttime Жыл бұрын
Your videos are super informative and concise. I wish you’d make one on everything code related, they really get the point across. I can tell you’re working on it so here’s to many more. 👍
@slayingthedragon
@slayingthedragon Жыл бұрын
Much love ❤️❤️
@yasithsamarawickrama1683
@yasithsamarawickrama1683 Жыл бұрын
this was the best flexbox tutorial that i've ever seen, no rubbish, just straight to the point. nice work brother.
@rayeesdot310
@rayeesdot310 9 ай бұрын
flex-direction : column ; changes the axis is the best point
@marcobakkara
@marcobakkara 7 ай бұрын
bruh I thought because the video is so short it was not complete. but I mind my wrong. This video is very creative!
@iMagicGraalOnline
@iMagicGraalOnline Жыл бұрын
I would love to see something like this for grid. So much content very well explained in very little time. Awesome content!
@slayingthedragon
@slayingthedragon Жыл бұрын
I have one for grid :p
@HocineKamikaz
@HocineKamikaz Жыл бұрын
@@slayingthedragon is it out yet? If yes we need the link and thanks that explanation is gold!
@slayingthedragon
@slayingthedragon Жыл бұрын
@@HocineKamikaz kzbin.info/www/bejne/e5qxmoZ8frV8h6c 😊
@HocineKamikaz
@HocineKamikaz Жыл бұрын
@@slayingthedragonmy duuuude...!! Thankssss a million time❤️
@tcg2717
@tcg2717 Жыл бұрын
Succinctly explained without too much unnecessary fluff. Earned a sub.
@gt8846
@gt8846 Жыл бұрын
Thank you bro, your teaching is so easy to understand.
@85MA
@85MA 5 ай бұрын
I must say, it was awesome! I spent only 8 minutes and 15 seconds, and gained pure knowledge and a great learning experience. Hats off to you! Please keep making awesome video tuts like this one, as they really help us learn with quality. THANK YOU FOR MAKING LEARNING SO EASY!
@SuperDarmino
@SuperDarmino 2 жыл бұрын
What if you put flex-grow: 0.9; or 0.8; ? So the 1 or the 0.9 just basically equates to a percentage where 1 means 100% of the space left and 0.9 means 90% etc.? Btw your explanation is really straight to the point and it makes it even easier to comprehend with the added graphics
@slayingthedragon
@slayingthedragon 2 жыл бұрын
Yes that's exactly how that works, 0.9 or any other number here is a unitless value that represents a fractional value of the remaining space available. I see now though that perhaps I could have explained that part better. I'll pin this comment so that others can see. Thank you ☺!
@SuperDarmino
@SuperDarmino 2 жыл бұрын
@@slayingthedragon Thank you mate. Looking forward to you future tutorials
@fizzinsoda
@fizzinsoda Жыл бұрын
you didn't do the gap: idk if it was out yet or not, but using gap: 5%; or whatever num you wanna use is pretty nice
@slayingthedragon
@slayingthedragon Жыл бұрын
@@fizzinsoda I did, 4:09 😋
@bryggmastaren
@bryggmastaren 2 ай бұрын
thank u thank u thank u!!!!!! ive tried grasping this but u made it very easy to understand. can't thank u enough
@123arskas
@123arskas Жыл бұрын
Please make such concise videos for: 1- Bootstrap 2- Tailwind 3- React 4-MongoDB
@kurtthorsten4463
@kurtthorsten4463 Жыл бұрын
bro, simple and to the point. great video, thank you
@lebersa
@lebersa 2 жыл бұрын
Fast, simple and straight to the point. Is it possible doing a tutorial about grid? Thanks from Brazil!
@slayingthedragon
@slayingthedragon 2 жыл бұрын
Thanks! Yea actually already working on the grid video should be out Monday !
@Katzilla-1
@Katzilla-1 10 ай бұрын
This is such a great explanation without overcomplicating anything. I feel like I finally understand flexbox a little more :D Thank you for your video!!
@LearnedJohn
@LearnedJohn 12 күн бұрын
The Odin Project --> Slaying The Dragon --👇
@jayjaayjaaay94
@jayjaayjaaay94 8 ай бұрын
as a person who hates css, this video helps me a lot ! subscribed!
@3agroup834
@3agroup834 5 ай бұрын
Thank you so much
@nathanlecam941
@nathanlecam941 Жыл бұрын
I went on 5 hours of research to understand flexbox, I didn't understand much and I just watched your video and that's it I understood! Thank you, it's clear and easy, no complicated terms and the explanation of the axis change a lot of thing!
@brayannkouam9097
@brayannkouam9097 Жыл бұрын
This is the best flexbox tutorial ever. You just saved me. Keep up champ you deserve great
@sanketpatil8682
@sanketpatil8682 Жыл бұрын
Bro can you make CSS web development course and put it in KZbin 🙏👌
@slayingthedragon
@slayingthedragon Жыл бұрын
I might do that yes 🙂
@uglypotato9117
@uglypotato9117 Жыл бұрын
accidentally clicked subscribe button and now i don't want to unsubscribe,,,,, this guy deserves it 💓💓
@SnakesRaven
@SnakesRaven 10 ай бұрын
Well explained, to the point, no fluff... First tutorial I watch of this channel and I"m already impressed. Good job man!
@its_mah_way2717
@its_mah_way2717 9 ай бұрын
This was everything I needed to know... Thank you so much 👍
@nnejiben
@nnejiben 9 ай бұрын
Awesome video! Searching for a short tutorial on CSS Flexbox and this is the best I've seen so far.
@JoaKimzen
@JoaKimzen Жыл бұрын
your videos are currently saving my ass in uni, thank you so much. I would've given up already if it wasn't for these videos
@junaidsindhu499
@junaidsindhu499 Жыл бұрын
Straight forward,no time waste,Appreciate your work. Cover all important items of flex .
@edittrendz3841
@edittrendz3841 5 ай бұрын
Loved this slightly complicated topic the way you made it easy for us.. thank you!❤
@claudioparra8507
@claudioparra8507 Жыл бұрын
In the first minute, you explained what my professor couldn't in a whole semester. THANK YOU. I finally know why it works the way it works. I won't have to rely just on memory anymore.
@slayingthedragon
@slayingthedragon Жыл бұрын
Haha im happy I could help 😁
@kasperspace
@kasperspace 4 ай бұрын
thank you so much for making this video :-D someone sent me this tutorial to use along with another one and a website and this helped me alot to understand specific properties used in flexbox and what they do
@SkillslliK
@SkillslliK 5 ай бұрын
Pretty high quality of you to teach brother :). I knew that justify-contents and align items definition but, explanation of flex-direction was truly phenomenal :).
@AZyzk
@AZyzk Жыл бұрын
Thank you! I was able to solve things my teacher hadn't explained and you were very clear and on point.
@heckyes
@heckyes Жыл бұрын
Straight to the point, no bull shit, and only one error. Well done. Best Flex tut on KZbin.
@sparetimewithshanae6843
@sparetimewithshanae6843 11 ай бұрын
🎉 Awesome I was on the verge of quiting , then I saw your video and gained hope.
@antoniobrandao1642
@antoniobrandao1642 Жыл бұрын
You just made me learn a concept in 8 minutes that would probably take an entire hour. Awesome video!
@lekhasri308
@lekhasri308 Жыл бұрын
This is the best channel for learning css i have ever came across which is time-saving and super understanding. keep going on !
@_VIC_2023
@_VIC_2023 4 ай бұрын
Damn! I understood half way actually, will understant it fully after doing it practically. Thank you so much sir
@wh1mZ
@wh1mZ Жыл бұрын
Damn bro, I've watched alot of flex css tuts and they were even long af, this is the only video that gave me enlightenment and how to really use it. Thanks man!
@jasperbreis3124
@jasperbreis3124 26 күн бұрын
man is the goat!! great content bro
@person81045
@person81045 Жыл бұрын
Brooooo. This is a BANGER video. No bs. Just straight to the heart. I love it. Subbed.
@123arskas
@123arskas Жыл бұрын
Short, Precise, Accurate, Concise and Easy Tutorial. You really SLAYED THE DRAGON here brother. SUBSCRIBED !!!
@bluemuffincap2975
@bluemuffincap2975 10 ай бұрын
It feels like I've reached enlightenment. Thanks for the explanations, this made flexbox so much more easier to understand.
@SenneCools
@SenneCools Жыл бұрын
This video helped me finally understand what I'm doing when I use flexbox
@Charlito33
@Charlito33 Жыл бұрын
I never tried to use flexbox, but now, I see how it's so useful ! Thanks you a lot !
@Wangaruro
@Wangaruro Жыл бұрын
Literally the best Flexbox tutorial I have seen!!! I've learnt so much in 8 minutes.
@pajalixd4016
@pajalixd4016 8 ай бұрын
Thank you so much ! I couldn't understand how the positioning of flexbox works but now thanks to you, I finally understand ! Keep doing this amazing work ! Have a wonderful and beautiful day !
@sayanmanna2511
@sayanmanna2511 Жыл бұрын
Bro it is so well explained in such a short time. No bs, pure content.. 🔥
@shiftfilms
@shiftfilms 8 ай бұрын
Thanks for putting this together; I wrote the 8-minute video for reference. Being new, this really helped. I am looking forward to more of your videos.
@angeloc700
@angeloc700 5 күн бұрын
I like how you explain things and then review those items from time to time. Nice work and thank you for sharing!!
@erickchavez4551
@erickchavez4551 Жыл бұрын
The visuals you include make everything much easier to understand. 10 out of 10!
Learn CSS BOX MODEL - With Real World Examples
17:45
Slaying The Dragon
Рет қаралды 142 М.
Learn CSS Grid - A 13 Minute Deep Dive
13:35
Slaying The Dragon
Рет қаралды 618 М.
Симбу закрыли дома?! 🔒 #симба #симбочка #арти
00:41
Симбочка Пимпочка
Рет қаралды 3,9 МЛН
Trick-or-Treating in a Rush. Part 2
00:37
Daniel LaBelle
Рет қаралды 47 МЛН
The Ultimate Sausage Prank! Watch Their Reactions 😂🌭 #Unexpected
00:17
La La Life Shorts
Рет қаралды 8 МЛН
This Game Is Wild...
00:19
MrBeast
Рет қаралды 130 МЛН
How to take control of Flexbox
16:01
Kevin Powell
Рет қаралды 142 М.
Learn All Types of CSS Border Animations in Just 5 Minutes
4:38
Learn CSS Subgrid in 14 minutes
14:19
Slaying The Dragon
Рет қаралды 87 М.
Top 10 CSS One Liners That Will Blow Your Mind
13:34
developedbyed
Рет қаралды 980 М.
CSS Flexbox Crash Course
35:53
freeCodeCamp.org
Рет қаралды 215 М.
Learn CSS Animations In 20 Minutes - For Beginners
21:22
Slaying The Dragon
Рет қаралды 1,1 МЛН
CSS Tips And Tricks I Wish I Knew Before
12:12
Lama Dev
Рет қаралды 491 М.
Learn CSS flexbox in 10 minutes! 💪
10:01
Bro Code
Рет қаралды 185 М.
Симбу закрыли дома?! 🔒 #симба #симбочка #арти
00:41
Симбочка Пимпочка
Рет қаралды 3,9 МЛН