Learn CSS flexbox in 10 minutes! 💪

#CSS #course #tutorial
CSS flexbox introduction tutorial example explained
00:00:00 intro
00:00:12 HTML setup
00:00:52 CSS setup
00:01:58 display: flex
00:02:18 flex-direction
00:02:58 justify-content
00:04:13 CSS setup
00:04:48 align-items
00:05:48 flex-wrap
00:06:41 align content
00:07:43 gap
00:08:30 align-self
00:09:21 order
00:09:46 conclusion

[@BroCodez]

Bro Code 1 2 3 4 /* style.css */ .container{ display: flex; height: 90vh; } .box{ width: 150px; height: 150px; font-size: 8em; text-align: center; border-radius: 15px; } #box1{ background-color: hsl(0, 100%, 70%); } #box2{ background-color: hsl(52, 100%, 70%); } #box3{ background-color: hsl(111, 100%, 70%); } #box4{ background-color: hsl(201, 100%, 70%); }

[@Zakibinxaaji1]

Thanks bro 😊

[@Free.DrAfia]

I don't understand why people don't watch his channel, like its so easy explanation, I didn't get bored. My concepts get more clear. THANKA TO BRO CODD

[@chiggywiggy524]

Wait for some time, it's been only around 2 months. Besides, if you search flexbox on youtube only older videos from different creaters will come up. People are unable to find these videos because of algorithm.

[@G_.G_.G]

Best teachers award goes to "Bro code" 👏🏻👏🏻

[@secretr5024]

I was really struggling with learning how to structure content and this helped a lot!!!

[@mikiyasayele9767]

you are legend...you make my frontend journey easy

[@chansfor]

A master class in how to present technical material. Thank you!

[@zahid1909]

You are a real Master, bro! Respect!!

[@willwill1738]

Most succinct and down to earth teaching on Flexbox with easy code example and lead you a thorough understanding, million thanks Pal!!!

[@danielisaac3722]

Tanks bro helpful Playlist

[@pctechinfosys]

One of the best & precise description of Flex box😃

[@khurumshahzad6521]

Amazing explaination in a short time

[@capslock3250]

Amazing tutorial. Thanks 👍

[@sam4457]

amazing amazing video

[@mirzakhursheedabbas4184]

🎉bro iam curiously waiting for ur new series finally it happens.your a captain America for code beginners bro😊

[@dennispacho9532]

Huge respect to this man

[@SaidSaeed-bcbcaa]

thank you my brother your voice its awsome and you explain everything in easy way. you help so much I am from morocco

[@nnejiben]

This is really good and very helpful. Thank you!

[@suyashman7964]

Epic bro

[@namanthacker]

Wonderful video man Thanks a lot

[@sereneflatun]

Thank you so much ⭐️

[@ayMillmusic]

Life savior 🎉

[@giorgiberdzenishvili4115]

მადლობა. thanks.

[@MrKhulaid]

Bro code, your content is amazing, bro. Keep up the amazing work, bro 😊

[@rimavedeckiene2203]

thank you. I understood flexbox. God luck🤩

[@-Corvo_Attano]

Whole Flexbox concepts covered in just 10 minutes

[@user-ht9sy4yc2e]

Lovely😊

[@OUTSS1]

Such a helpful video thank u

[@kubataiupov1245]

Thanks bro!

[@anuc1804]

Please do a video on grid as well

[@Crowmeir]

My bro I'm on my journey to force myself in learning CSS so I won't have to google way too much. Your vids definitely helps a lot!

[@CorDeLapis]

I'm from Brazil and i have a technical english. I could understand everything what you taught about flexbox.

[@vaibhavwadhavane874]

amazing bro.

[@S_Y_R_Falcon]

thanks

[@makansari1425]

Lovely

[@masfiqurrahman984]

Super talented

[@josephmiller3823]

Learning front end right now I dislike it so far waiting for backend but you’re making it a lot easier

[@imadiman528]

You're a gigachad thanks a bunch

[@djfago6240]

I have a special name that I always call him with...( Bro Genius). Sometimes I wonder how big his brain is. Thank you for everything sir .

[@kerimtim]

Thanks great video. I was also expecting to see flex-grow, flex-shrink

[@gentlman847]

bro you are the best may Allah bless you 🤲

[@chilli_Tea]

God died a long tìme ago new kid

[@chrissylaurenbutler3639]

Super Helpful. My teacher makes no sense

[@makuaac4199]

❤❤❤❤

[@user-ug5cy5ve4g]

amazing explanation thanks(:

[@miahaspeace3404]

where are you from

[@jay-in-az]

Good video. Q: instead of the number and color, is it possible to have a graphic inserted into the box?

[@KingShortssz]

+1 subscriber!

[@horacinis]

I thought the default value for align-items was stretch, and not flex-start 😕 Thanks for such a great video!

[@ShashankJ04]

one grid video please!!!!!

[@abuqeisimran9676]

Easy to understand, and really help me, the newbie. Thanks a ton Sir.

[@andycheung83a]

Will you do Grid Please

[@MarkyGoldstein]

In 1993 this was a dream, and in 2009 it became a plan

[@Osamzkitchen]

Pls can you post shopping cart tutorial

[@rohitpariyar1095]

Please explain CSS GRID

[@SOLDAT_MENDES]

css grid is a powerful layout system in css that allows you to create grid-based designs. it helps you divide your webpage into rows and columns, making it easier to position and align elements. it's a great tool for creating responsive and flexible layouts.

[@yashwantlahre4863]

​@@SOLDAT_MENDEShe meant in video but still thanks 👍

[@sherlockholms2544]

Hello . Please do a front-end project from scratch

[@govind9060]

wish you were my college teacher..

[@capslock3250]

Grid?

[@Alex-uc9gp]

hallå kan du göra min kod

[@heygaurav]

Comment if you're watching Adit?

[@Ella_1994]

.Bro-Code { text-align: THE BEST; }