Learn CSS flexbox in 10 minutes! 💪

แชร์
ฝัง
  • เผยแพร่เมื่อ 20 พ.ย. 2024

ความคิดเห็น • 106

  • @BroCodez
    @BroCodez  ปีที่แล้ว +78

    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%);
    }

  • @Free.DrAfia
    @Free.DrAfia ปีที่แล้ว +159

    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
      @chiggywiggy524 ปีที่แล้ว +7

      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.

    • @dj-yv7oi
      @dj-yv7oi 4 หลายเดือนก่อน

      @@chiggywiggy524 i typed flexbox and this came up in top5

    • @VishalPatil-cx9pr
      @VishalPatil-cx9pr 3 หลายเดือนก่อน

      May be the language is in english

    • @GodFraud
      @GodFraud 2 หลายเดือนก่อน

      It is because it is an old comment. The channel has over 2milion subscribers now..

    • @CR7-the-Goat-in-football
      @CR7-the-Goat-in-football 2 หลายเดือนก่อน

      True​@@VishalPatil-cx9pr

  • @G_.G_.G
    @G_.G_.G 9 หลายเดือนก่อน +41

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

  • @jdspillers77
    @jdspillers77 6 หลายเดือนก่อน +6

    This one was probably the best explanation I have found so far. Conceptually Flex-box makes complete sense to me, but for some reason, I have been struggling with it when building pages. This tutorial helped iron out some of the confusion I was still having.

  • @spejr879
    @spejr879 5 หลายเดือนก่อน +5

    I watch a lot of coding videos on TH-cam for reference to subjects I'm not clear on. You do the best job at passing in between tasks while entering your code. You're a great teacher. Other TH-camrs rush through the content and talk too much and too quickly. But you hands down hit it right on the nail. For that I must say thanks. You understand that the people that watch these videos are mostly beginners / students and not professional web developers. Thanks....

  • @deniseauneelvestad3206
    @deniseauneelvestad3206 6 หลายเดือนก่อน +5

    OMG, you are seriously the one who teaches just how I understand things. I've watched plenty of other videos, but you are the only one who talks to my brain so it understands. Thank you

  • @willwill1738
    @willwill1738 7 หลายเดือนก่อน +1

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

  • @mikiyasayele9767
    @mikiyasayele9767 10 หลายเดือนก่อน +7

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

  • @RobertTurman-b1e
    @RobertTurman-b1e 29 วันที่ผ่านมา

    I have learned more from this channel than an entire semester in college! Thanks bro!!!

  • @pctechinfosys
    @pctechinfosys 8 หลายเดือนก่อน +2

    One of the best & precise description of Flex box😃

  • @secretr5024
    @secretr5024 11 หลายเดือนก่อน +12

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

  • @KarminsLynn
    @KarminsLynn 19 วันที่ผ่านมา

    Damn this explanation was way better than one in the freecodingcamp. Thank you!

  • @chansfor
    @chansfor 8 หลายเดือนก่อน +1

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

  • @zahid1909
    @zahid1909 11 หลายเดือนก่อน +4

    You are a real Master, bro! Respect!!

  • @-Corvo_Attano
    @-Corvo_Attano ปีที่แล้ว +8

    Whole Flexbox concepts covered in just 10 minutes

  • @CorDeLapis
    @CorDeLapis 10 หลายเดือนก่อน

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

  • @Crowmeir
    @Crowmeir 7 หลายเดือนก่อน

    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!

  • @khurumshahzad6521
    @khurumshahzad6521 9 หลายเดือนก่อน +2

    Amazing explaination in a short time

  • @anuc1804
    @anuc1804 ปีที่แล้ว +9

    Please do a video on grid as well

  • @qazimtahir
    @qazimtahir 5 หลายเดือนก่อน

    This is a really super easy explanation for new programmers. ❤

  • @josephmiller3823
    @josephmiller3823 9 หลายเดือนก่อน

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

  • @DesmondPrince-d1f
    @DesmondPrince-d1f 4 หลายเดือนก่อน

    Simple,straightforward and understandable ❤

  • @djfago6240
    @djfago6240 ปีที่แล้ว +5

    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 .

  • @mirzakhursheedabbas4184
    @mirzakhursheedabbas4184 ปีที่แล้ว +4

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

  • @said-nouasria
    @said-nouasria 10 หลายเดือนก่อน

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

  • @danielisaac3722
    @danielisaac3722 ปีที่แล้ว +3

    Tanks bro helpful Playlist

  • @gentlman847
    @gentlman847 10 หลายเดือนก่อน +6

    bro you are the best may Allah bless you 🤲

    • @Chilli_Tea
      @Chilli_Tea 6 หลายเดือนก่อน

      God died a long tìme ago new kid

  • @FrederikWoellert
    @FrederikWoellert 23 วันที่ผ่านมา

    BroI really like your easy explanation.

  • @will_kennard
    @will_kennard หลายเดือนก่อน

    Spot on, straight to the point.

  • @MrKhulaid
    @MrKhulaid 8 หลายเดือนก่อน

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

  • @sam4457
    @sam4457 10 หลายเดือนก่อน +1

    amazing amazing video

  • @michaelkrailo5725
    @michaelkrailo5725 2 หลายเดือนก่อน +1

    Most important part is flex grow, shrink, and basis.

  • @chrissylaurenbutler3639
    @chrissylaurenbutler3639 8 หลายเดือนก่อน

    Super Helpful. My teacher makes no sense

  • @horacinis
    @horacinis 9 หลายเดือนก่อน

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

  • @samkarema4045
    @samkarema4045 หลายเดือนก่อน

    Hey BroCode, thank you so much for this useful video! Btw, which tool are you using in the video please?

  • @dennispacho9532
    @dennispacho9532 7 หลายเดือนก่อน

    Huge respect to this man

  • @aimandurrani2436
    @aimandurrani2436 3 หลายเดือนก่อน

    Great Explanation...!

  • @AmirLT-x6y
    @AmirLT-x6y 10 หลายเดือนก่อน

    thank you. I understood flexbox. God luck🤩

  • @MarkyGoldstein
    @MarkyGoldstein 7 หลายเดือนก่อน +1

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

    • @Yehor-v7y
      @Yehor-v7y 25 วันที่ผ่านมา

      Villain dialogue

  • @kerimtim
    @kerimtim 7 หลายเดือนก่อน

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

  • @capslock3250
    @capslock3250 8 หลายเดือนก่อน

    Amazing tutorial. Thanks 👍

  • @nnejiben
    @nnejiben 9 หลายเดือนก่อน

    This is really good and very helpful. Thank you!

  • @namanthacker
    @namanthacker 8 หลายเดือนก่อน

    Wonderful video man
    Thanks a lot

  • @JessieTraslavina
    @JessieTraslavina 4 หลายเดือนก่อน

    Well explained

  • @abuqeisimran9676
    @abuqeisimran9676 ปีที่แล้ว +3

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

  • @OyewusiHalimat
    @OyewusiHalimat หลายเดือนก่อน

    very easy to understand thanks so much bro code

  • @genildomirandapraca1926
    @genildomirandapraca1926 4 หลายเดือนก่อน

    Great!!

  • @jay-in-az
    @jay-in-az 10 หลายเดือนก่อน

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

  • @imadiman528
    @imadiman528 9 หลายเดือนก่อน

    You're a gigachad thanks a bunch

  • @AbinayaSivasamy
    @AbinayaSivasamy 4 หลายเดือนก่อน

    Satisfying!

  • @thabokennethnkambule-mw7cu
    @thabokennethnkambule-mw7cu 4 หลายเดือนก่อน

    Thanks you solved my problem again thank you 😊

  • @salwaahmadz6215
    @salwaahmadz6215 6 หลายเดือนก่อน

    Finally, I can center a div

  • @user-ht9sy4yc2e
    @user-ht9sy4yc2e 9 หลายเดือนก่อน

    Lovely😊

  • @masfiqurrahman984
    @masfiqurrahman984 9 หลายเดือนก่อน

    Super talented

  • @pyaephyo8108
    @pyaephyo8108 4 หลายเดือนก่อน

    Thank You Sir❤

  • @Geat-Football_World
    @Geat-Football_World 2 หลายเดือนก่อน

    hot explanation

  • @makansari1425
    @makansari1425 9 หลายเดือนก่อน

    Lovely

  • @OUTSS1
    @OUTSS1 9 หลายเดือนก่อน

    Such a helpful video thank u

  • @ayMillmusic
    @ayMillmusic 11 หลายเดือนก่อน

    Life savior 🎉

  • @NLEXPLORER
    @NLEXPLORER 5 หลายเดือนก่อน +1

    I suggest to use grid. Grid is much more easer and way less code then flexbox. This is a littlebit old fasioned coding and does not have the flexability as Grid.

  • @מיקהישראלי-ע6נ
    @מיקהישראלי-ע6נ 11 หลายเดือนก่อน

    amazing explanation thanks(:

    • @kentkent23722
      @kentkent23722 10 หลายเดือนก่อน +1

      where are you from

  • @mdmehedihassan8325
    @mdmehedihassan8325 5 หลายเดือนก่อน

    really helpful

  • @andycheung83a
    @andycheung83a 10 หลายเดือนก่อน +1

    Will you do Grid Please

  • @giorgiberdzenishvili4115
    @giorgiberdzenishvili4115 ปีที่แล้ว +1

    მადლობა. thanks.

  • @vaibhavwadhavane874
    @vaibhavwadhavane874 ปีที่แล้ว

    amazing bro.

  • @sereneflatun
    @sereneflatun 8 หลายเดือนก่อน

    Thank you so much ⭐️

  • @NataliaLassance
    @NataliaLassance 2 หลายเดือนก่อน

    THANK YOU!

  • @marqueldavis9244
    @marqueldavis9244 4 หลายเดือนก่อน

    With this same example cab you show how to set a smaller background within the numbers?

  • @govind9060
    @govind9060 9 หลายเดือนก่อน

    wish you were my college teacher..

  • @sherlockholms2544
    @sherlockholms2544 7 หลายเดือนก่อน

    Hello . Please do a front-end project from scratch

  • @kathikr9360
    @kathikr9360 6 หลายเดือนก่อน

    Thank you

  • @KingShortssz
    @KingShortssz 7 หลายเดือนก่อน

    +1 subscriber!

  • @ShashankJ04
    @ShashankJ04 11 หลายเดือนก่อน

    one grid video please!!!!!

  • @kubataiupov1245
    @kubataiupov1245 ปีที่แล้ว

    Thanks bro!

  • @boriwayeoluwatosin2521
    @boriwayeoluwatosin2521 6 หลายเดือนก่อน

    Thank you ❤

  • @S_Y_R_Falcon
    @S_Y_R_Falcon ปีที่แล้ว +1

    thanks

  • @suyashman7964
    @suyashman7964 ปีที่แล้ว

    Epic bro

  • @Osamzkitchen
    @Osamzkitchen ปีที่แล้ว

    Pls can you post shopping cart tutorial

  • @larryabcde
    @larryabcde 5 หลายเดือนก่อน

    Is there are similar property to align self to the other axis

  • @rejuzaman6365
    @rejuzaman6365 2 หลายเดือนก่อน

  • @Alyosha922
    @Alyosha922 5 หลายเดือนก่อน

    thanks bro code

  • @makuaac4199
    @makuaac4199 ปีที่แล้ว

    ❤❤❤❤

  • @cxovrebacxovreba1103
    @cxovrebacxovreba1103 2 หลายเดือนก่อน

    how can I do it inside of an image

  • @CarmenQuincy-g2h
    @CarmenQuincy-g2h หลายเดือนก่อน

    Hernandez Mary Gonzalez Paul Lewis Edward

  • @setasan
    @setasan 6 หลายเดือนก่อน

    Althoght i am more of a grid guy i really enjoy flexbox despise being so verbose.

  • @TriedNot2Hate
    @TriedNot2Hate หลายเดือนก่อน

    The video being exactly 10 minutes💀

  • @CarmenQuincy-g2h
    @CarmenQuincy-g2h 2 หลายเดือนก่อน

    White Richard Garcia Kimberly White Shirley

  • @heygaurav
    @heygaurav 6 หลายเดือนก่อน

    Comment if you're watching Adit?

  • @Ella_1994
    @Ella_1994 8 หลายเดือนก่อน +1

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

    • @Yehor-v7y
      @Yehor-v7y 25 วันที่ผ่านมา

      That is not a valid property value

  • @The_IrfanAnsari
    @The_IrfanAnsari 6 หลายเดือนก่อน

    The way you explain it melt my heart 💖 thanks a lot 🪄