CSS Flexbox Crash Course

Рет қаралды 203,353

2 жыл бұрын

Master CSS Flexbox from scratch.
✏️ Course created by DevArsenal Official. Check out their channel: / channel
🔗 The creator has a full CSS and HTML course on Udemy: www.udemy.com/course/beginner...
😀 Coupon Code: GREAT_DISCOUNT
Cheat Sheets:
🔗 www.dropbox.com/s/zuki7ssr385...
🔗 www.dropbox.com/s/5c1a46kavp0...
🎉 Thanks to our Champion and Sponsor supporters:
👾 Wong Voon jinq
👾 hexploitation
👾 Katia Moran
👾 BlckPhantom
👾 Nick Raker
👾 Otis Morgan
👾 DeezMaster
👾 Treehouse
👾 AppWrite
--
Learn to code for free and get a developer job: www.freecodecamp.org
Read hundreds of articles on programming: freecodecamp.org/news

Пікірлер: 170

@JarvisCodes 2 жыл бұрын

Flexbox is the most complex topic in CSS. These Tutorials are blessing for everyone here

@ihsannuruliman3656 2 жыл бұрын

Grid is. Flexbox is second.

@thanatp5498 2 жыл бұрын

@@ihsannuruliman3656 right, grid is more difficult.

@chubbyBunny94 2 жыл бұрын

CSS Grid: '"Am I a joke to you?"

@vincent3542 2 жыл бұрын

@DevArsenal Official thankyou sir, i really appreciate it all of your works, subscribed!

@maxcharacterlimitreache- 2 жыл бұрын

As a new comer to web development (1 week)i feel like every new topic is the most complex... And I'm at css basic level... The anxiety is real... The tutirial is so cool and easy tho

@marianagranadosgonzalez09 2 жыл бұрын

Going through the FCC curriculum and doing the challenges sometimes didn't clear enough the idea of Flexbox for me, thank you for making this vid, everything is making a lot more sense now.

@lokeshr9794 2 жыл бұрын

This is course is like a blessing for every developer. Thank you for your efforts ☺️☺️

@lawrencemotions8720 Жыл бұрын

I watched this a year ago and found it was the best tutorial for web development you dive straight into the most crucial parts of flex box with this and use of css ratio i was able to recreate high end e commerce sites thank you

@saifabdullahzarab1051 2 жыл бұрын

This video has cleared my concept of flex-box properly.So grateful of you❤️

@p.eriksonsaragi7129 2 жыл бұрын

Big big thank you!!, I wish I found this video when I first trying to learn about styling. This is the best educational video I've found about CSS in general!

@LaGrossePaulik 2 жыл бұрын

Wow, big thank you, your video helped me a lot! These concepts are kind of a new gymnastic to get used to, but now I'm feeling more... flexible.

@apotheosisaurel9248 2 жыл бұрын

Thanks so much for the tutorial, the cheat sheets and this incredibly amazing channel. 🖤🌼

@dprym 2 жыл бұрын

such a useful feature in simple understanding, thanks for your efforts and keep doing the good work

@abiharvey4984 2 жыл бұрын

This video and the cheatsheets are so useful - thank you!!

@richcaro3132 2 жыл бұрын

grid or flex; No confusion now. Both are equally awesome. Beautiful teaching .

@learntocode1878 Жыл бұрын

@DevArsenal, thank you so much for this video. I found flexbox sometimes to be so simple to understand and at the same time so confusing. Please make more videos like this. Thank you Sir

@dennisobediahleboe7274 2 жыл бұрын

Oh thank you. I needed this sooo much.

@chomzzycute1289 Жыл бұрын

i've been looking for a video that would explain css flex box to me like i'm five and this did that perfectly. i understand now pretty much all the values. thank you very much.

@mordecaimusa9496 Жыл бұрын

Thank you so much for this This course was truly a blessing for me

@worldclasscode1847 2 жыл бұрын

Nice vid! I love Flexbox. It's so useful. I use it on each and every web page, multiple times.

@diogos7233 2 жыл бұрын

This video came in handy. Thanks for taking the time to do this video.

@abrh2793 2 жыл бұрын

What are the odds! I was just looking for a yt flex box guide! Thank you FCC

@relytheone853 11 ай бұрын

Thank you so much for this! Now I'm aware of flex-box capabilities.

@abhishes 2 жыл бұрын

loved this course. so simple and so useful. very well explained

@copaceticobserver 2 жыл бұрын

Thank you! I was struggling to understand flexbox

@landsfadern2 2 жыл бұрын

this is good to learn since i'm going to a course with css in a few weeks

@haifzhan 2 жыл бұрын

It’s awesome, you read my mind!

@narc7885 2 жыл бұрын

Same literally I was struggling with a project with constant use of flexbox. FCC reads our minds

@johnmg1999 Жыл бұрын

Thank you so much for this 🙏🏻 Reading about flexbox as a beginner is pretty confusing. But with a visual representation + voiceover, it helped out immensely. Thank you again!

@miriammunetsi1833 Жыл бұрын

Thank you so much for for this educative tutorial. I benefited a lot. Thumbs up👍

@mohammadthousif7439 2 жыл бұрын

This video deserves more likes and viewes, great tutorial !!

@TranquilTinglesTV 7 ай бұрын

Thank you so much for helping us.. And especially for cheat sheets, these are also very beneficial

@litonhumayun Жыл бұрын

This has been very helpful. Thanks for the tutorial.

@lonleybeer 2 жыл бұрын

Wow i learned alot of new tricks in this video that i didn't know about, thank you

@sumantamukherjee406 2 жыл бұрын

Very helpful, crisp. Thanks!!

@douglasreybberido Ай бұрын

The trouble with Flexbox is the sheer number of items to remember and be acquainted with. Although the makers tried mightily hard to make the items' names indicate their function, it is still hard to remember them all. These cheat sheets and your illustrations (arrows and pointers) helped a ton. Thanks, man.

@padmasreesaiveeraaswaamy2359 2 жыл бұрын

Great content. I'm definitely buying the course right now! And I made the purchase ✌️

@jeromevaillancourt6489 2 жыл бұрын

How much does it cost?

@PerryCodes 2 жыл бұрын

Great content. One item of feedback - would have been nice if the cheat sheets were printable, but that's such a minimal thing for such great work! Thank you :)

@MrVirusDi 7 ай бұрын

A good lesson. Helped me figure out the basics of flex

@albertjjimenezp 2 жыл бұрын

Great explanation. Thanks a lot! Greeting from Colombia.

@sadhappy8860 9 ай бұрын

Super clear & super powerful information. Thank you very much

@usenmfonuko3271 2 жыл бұрын

My mind: You need to understand flexbox FCC: Gbam! Here you go... Thank you 🙏 FCC team

@athithakarikalan1222 2 жыл бұрын

Its very wonderful course. Its good to watch all beginners, expert... Thank u for this course free code camp 👍...

@keweml3544 2 жыл бұрын

Exactly what I need!

@miskerbirhanu4439 2 жыл бұрын

Thank you very much. It is really helpful css course.

@thecasemakerindonesia6071 Жыл бұрын

TNice tutorials was honestly so helpful. I’ve been working around soft, whether it be church, singing in a band, or theatre for most of my life so tNice tutorials

@avantikaroy5146 2 жыл бұрын

Do one on css grid as well!! Grid is important and a bit tricky as well.

@fullStackInKannada 2 жыл бұрын

Nice, I really liked it. Thank you for the video.

@vinceramcesoliveros6739 2 жыл бұрын

Great! Now I can center a div inside of a div.

@snansahmarov1524 2 жыл бұрын

All flex properties explained well. But very good video. Liked 👌❤️

@imuser007 2 жыл бұрын

thank u james, explained well.

@algorithmscodes-9927 2 жыл бұрын

this is some high quality tutorial!

@dyrelta9095 2 жыл бұрын

Thank you!

@vpundir3024 2 жыл бұрын

I was waiting for this

@shiuandai0426 Жыл бұрын

thank you! this video is awesome

@user-cj3xy2qe7h Жыл бұрын

Thank you so much for this video sir. ❤ from India.

@lionelfaith3646 8 ай бұрын

This course is gold

@RahulKumar-ed9vw 3 ай бұрын

thank you very much for this amazing video and cheatsheet

@josephkamande3219 Жыл бұрын

A very good course. Thank you very much

@edgeorge6243 2 жыл бұрын

Thx u a lot! There will be a Grid CSS course soon?

@quincylarsonmusic 2 жыл бұрын

Thanks!

@raadhaswami 2 жыл бұрын

awesomeeeeeee content, clear and simple

@webjaved 2 жыл бұрын

Awesome video tutorial! 👏

@MrTomro 2 жыл бұрын

i love this channel so much

@julient6508 2 жыл бұрын

Pretty smooth !

@franklee8099 2 жыл бұрын

Nice video and much appreciated!

@KZap_ 2 жыл бұрын

Thanks for this upload !

@ziadezzat8802 2 жыл бұрын

We're want a crash course like that but for grid

@mps_unltd 2 жыл бұрын

Great video. You wouldnt happen to have that cheat sheet for CSS Grid would you?

@razinulkarim5207 Ай бұрын

Thanks for the tutorial! Appreciate it! 1 Question: In the pdf, you provided (A-Container Properties), For Centering elements, you gave this below code. container { display: flex ; height: 50px; justify-direction: center ; align-tems: center; } My question is, are the last 2 lines correct?

@alexdesouza8696 2 жыл бұрын

Thank you for the great tutorial. I was wondering how to get the Editor and Browser windows side by side so you can simultaneously resize them to fill your entire screen.

@kevinmccallister7647 2 жыл бұрын

I think he has a Mac, he put the windows in full screen side by side mode, in windows 10 you can snap to side and resize both at and time too

@Naveen-ef2dg 2 жыл бұрын

Hi this video is super informative, could you tell me the plugin which you're using to have this type font for vs code?

@bipinmaharjan4090 2 жыл бұрын

I am taking this. 😍😍😍

@dumidupramith3881 Жыл бұрын

really thank you

@napoleon3242 2 жыл бұрын

bro is gonna kill me with the fonts!

@erickvazquez9113 2 жыл бұрын

"gobbledygook" 😩👌 I am going to be use this word from now on when I don't understand something

@richardhaynes1127 Жыл бұрын

Excellent cheat sheets.

@alexgordienko93 2 жыл бұрын

make the same video for grid , excellent!

@fireworks6795 2 жыл бұрын

thank you

@rimavedeckiene2203 4 ай бұрын

Thank you for your lesson about Flexbox. I printed Cheat Sheets and I studied and repeated.

@tlawatt Жыл бұрын

Thank youuuuu

@sayeddileri3461 2 жыл бұрын

god bless you guys!!!

@mahendranath2504 2 жыл бұрын

thank you so much

@SubashK-zc6ip 11 ай бұрын

Well Explained

@futboystar1883 Ай бұрын

Thanks

@hashirnouman8355 2 жыл бұрын

Love from Pakistan. Please make course of deployments and pwa

@punith023 2 жыл бұрын

In the cheat sheet for Flex parent, to center a div think there is a typo - justify-direction, should be justify-content right?

@t20sgrunt36 2 жыл бұрын

Great video

@olaegberebecca4995 Жыл бұрын

Awesome! How can I get the cheat sheet videos?

@WSBWallstreetBets 2 жыл бұрын

Is it possible to use a single container to make a 4-box design. Two on top, two on the bottom - looking like a big square. I've been able to achieve this by having two separate containers and then using each item to take up half of the container. And then they naturally stack on each other making that design. But I feel like it is possible to do with one container and I'm not understanding something.

@jesux_fstack 6 ай бұрын

Thank you guys, from Colombia, hello to all the Freecodecamp team

@ahmedalkhier5811 2 жыл бұрын

Plz make one video for grid system

@bakhtiyorumarov6555 2 жыл бұрын

good lesson

@DaniloSilva-pl3sq 2 жыл бұрын

Please bring a Grid Layout Crash Course

@DaniloSilva-pl3sq 2 жыл бұрын

@DevArsenal Official Grand!

@DaniloSilva-pl3sq 2 жыл бұрын

Yeah, definetely will check it out!

@sleshkatgcmc1382 2 жыл бұрын

I am a beginner in programming, I want to know where can I ask questions from advanced programmers. Are there any forums in Discord, Reddit, or something like that? (I am using Phyton and C# as my first languages)

@kevinmccallister7647 2 жыл бұрын

Stackoverflow, yes reddit and tech with tim discord

@vijayabhaskarj3095 2 жыл бұрын

I've just searching for some CSS tutorial on and this pop up.

@rainbowking4097 Жыл бұрын

God teachers are online than the classroom.

@dextroyer3525 6 ай бұрын

I don't know if anyone has pointed out about the mistakes in the container property cheat sheet. In the cheat sheet a, the black box containing actual code is showing flex-direction property instead of appropriate properties. Please take a look.

@changecollar 2 жыл бұрын

Help: When he typing background-color: (#cacaca), this first bracket are all color around this #cacaca. is this an extension? if extension exist what name this is?

@briankgarland 2 жыл бұрын

Good video. But I did laugh when you said "we are coming to the end of this video" and the video was only about 45% of the way through. 😆

@somunelavalli 2 жыл бұрын

Awesome FCC

@chubbyBunny94 2 жыл бұрын

hey future me, start from 25:00 - flex basis, grow and shrink!

@swamulugaday4839 2 жыл бұрын

freecodecamp do a video on 1. UML&design patterns 2. compiler design 3. Management and organizational behavior 4. Distributed systems 5. computer graphics etc..............