Bootstrap Grid System Tutorial | Bootstrap 5

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

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

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

    If anyone is thinking about 2 gutters in nested grid , you can remove container class from nested grid to avoid that ,
    Grid is very powerful , nice informative video Adrian 🎉

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

      That's great, and thanks!

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

    Congrats for 80K subs, Adrian! 🎉

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

      🎉

    • @fadhilrausyanfikr
      @fadhilrausyanfikr 3 ปีที่แล้ว

      @@AdrianTwarog Hi adrian! Can you make another project with react and bootstrap but now using bootstrap v5?? Thankss

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

      229k

  • @Sander-Brilman
    @Sander-Brilman 2 ปีที่แล้ว +7

    Amazing video, you got straight to the point and the explanation was clear. Exactly what i was looking for

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

    Your channel is so underrated, Adrian. Keep working hard, I am sure 1 day you will be at the top.

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

      Thanks, honestly I don't really worry about the numbers, I just enjoy the process :)

    • @msvlogs3744
      @msvlogs3744 2 ปีที่แล้ว

      @@AdrianTwarog great man 🔥 love from India 🇮🇳

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

    this was an amazing video, i still can´t get my head around it, but i know i´ll come back

  • @kartikkewalramani6696
    @kartikkewalramani6696 2 ปีที่แล้ว

    Bro gave so much info in just one vid.

  • @KG-ck9hb
    @KG-ck9hb 2 ปีที่แล้ว

    Couldn't understand the grid system just from reading the docs.
    Just by watching this , the first 6 minutes I completely understand the grid system now.

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

    thx Adrian,the way u explain the use of bootstrap classes is great n usefullllllllllll

  • @bogdanmind3271
    @bogdanmind3271 2 ปีที่แล้ว +6

    Excellent explanations and amazing video quality. Thank you so much!

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

    Bootstrap grid is ferkin genius.

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

    Excellent teacher

  • @ideagame3633
    @ideagame3633 3 ปีที่แล้ว

    ok , I was checking this video, waiting for the next one))). May the force be with you!

  • @vaibhavdandala9159
    @vaibhavdandala9159 3 ปีที่แล้ว

    Thank you so much this helped a lot when I didn't understand this very thoroughly in my book.

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

    thank you for the easy to follow thru tutorial, I've learned quite a lot!

  • @AjayChauhan-kb6pr
    @AjayChauhan-kb6pr 3 ปีที่แล้ว +1

    thank you adrian. it's really helpful for me.

  • @Tom-gv1fo
    @Tom-gv1fo 2 ปีที่แล้ว

    Nice and no time wasted, thanks

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

    Please make bootstrap series with projects

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

    Brilliant! Great explanations and just the right amount of information. Thank you!

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

    I wish you name the column differently so it's not confusing, as well as the border, which you did that, just very late into the video. Got very confusing.

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

    This was concise yet explained everything so clearly. I'm very impressed and thank you for teaching.

  • @rtbgenius2531
    @rtbgenius2531 3 ปีที่แล้ว

    love from india love your videos❤️💓❤️❤️

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

    Great video. Thank you. Really helpful.

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

    amazing wey!!! Muchas Gracias, and also you speak very well y puedo entender todo lo que hablas!!

  • @Sahil.1
    @Sahil.1 ปีที่แล้ว

    What an informative video thank you so much buddy you just made my work easier

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

    This is incredibly informative, love this format!

  • @Brandon-bm7hp
    @Brandon-bm7hp ปีที่แล้ว

    It would be nice to see actual content in the columns many beginners see the columns but once its time to add content to the columns they are back at square one

  • @baltagadda
    @baltagadda 2 ปีที่แล้ว

    you are great explaining

  • @DevMadeEasy
    @DevMadeEasy 3 ปีที่แล้ว

    Hey Adrian Twarog... Nice content, thanks for sharing it! 🙏

  • @denisgarden1
    @denisgarden1 2 ปีที่แล้ว

    This one is great! Where is the next video?

  • @billywapp2201
    @billywapp2201 2 ปีที่แล้ว

    Thank you pally budsssssss

  • @arosh.akalanka
    @arosh.akalanka 3 ปีที่แล้ว +2

    Wow! Thank u ♥

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

    Thanks!

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

    Awesome content!

  • @abod8121
    @abod8121 3 ปีที่แล้ว

    Your content is awesome, please keep going what you doing. Much love

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

    Why don't you upload more videos per week? Your videos are so polished and amazing!!!

    • @AdrianTwarog
      @AdrianTwarog  3 ปีที่แล้ว

      Because they are polished (I'm Polish!) and amazing, I spend more time on them and can only get out so many per week! But I'm trying to do more :) with some tutorials, some real world stuff, and some tips and tricks each week.

  • @self-tilted
    @self-tilted 3 หลายเดือนก่อน

    THANK YOU GOOD MAN

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

    Great Topic, Thanks Adrian :)

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

    Thanks brother

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

    Nice one! Worth to watch. Just would suggest to remove the code from previous examples so newbies like me can focus better on what the code is doing. Or change border color for every example 🙏

  • @digigoliath
    @digigoliath 3 ปีที่แล้ว

    Awesome!!! TQVM!!

  • @jackson159
    @jackson159 3 ปีที่แล้ว

    Really Good Video! Thanks a lot

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

    Wonderful video, but would like a full video on CSS Grid(I'm waiting🕑)

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

      It's on my list, if you saw that list, you might see why it takes ages!

  • @zensic
    @zensic 2 ปีที่แล้ว

    Thank you!

  • @nro337
    @nro337 3 ปีที่แล้ว

    Awesome video, thank you!!

  • @mukithasan9684
    @mukithasan9684 2 ปีที่แล้ว

    Very helpful and easy to learn you deserve a like and a sub

  • @Uvi3112
    @Uvi3112 3 ปีที่แล้ว

    This video is really cool. thnks

  • @codechimps
    @codechimps 2 ปีที่แล้ว

    Ah such a good video, thank you!

  • @SohailKhan-tc8uz
    @SohailKhan-tc8uz 3 ปีที่แล้ว

    Brother please make a crash course on Tailwind CSS.

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

    This is outdated though. Starting with 5.1 you can opt-in to CSS Grid system (not row/col but grid/g-col instead) which will be the way to go.
    This tutorial is good but the row/col has been there since Bootstrap 3 which was released almost 10 years ago...

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

    Weird. Every time I did this there was a space on the outside. I followed the tutorial exactly and it didn't do this to you.

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

      Could be the veiwport or the container, container comes with a padding naturally

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

    Having such a wide monitor, are you having troubles with testing responsive websites / designs (desktop, tablet, mobile)?
    How do you figure out what your design would look on average full HD screen / laptop?

    • @AdrianTwarog
      @AdrianTwarog  3 ปีที่แล้ว

      I have 4 browsers that I can open on each responsive viewport to test live as I develop!

    • @velocity4739
      @velocity4739 2 ปีที่แล้ว

      @@AdrianTwarog which 4 browsers do you use?

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

    cool video)

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

    where is part 2?

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

    How to add the space between two columns?

    • @mudassirsayed8703
      @mudassirsayed8703 3 ปีที่แล้ว

      add gx-4 Or any number of spaces in a row div
      gx is for horizontal gaps and gy is for vertical

  • @gauravpandey3722
    @gauravpandey3722 3 ปีที่แล้ว

    I have 3 columns and want vertical divider line between them. So i added extra two divs with border width 2px and problem is 3rd div breaks into new line, how to fix that?

  • @kingmahdi-l6s
    @kingmahdi-l6s 3 หลายเดือนก่อน

    How can understand that site need to wich columns how can we split it?

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

    I really like your content, but the last example of this video, about nesting is totaly broken. Documentation says that it is invalid when nesting container class div inside other container class div.

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

      Thanks for this, indeed it should just have been a row inside the column, and not a container with a row. Thanks for that I didn't spot it!

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

    If we specify 2 for sm and 4 for md what happens when we go to lg or xs

  • @letmebe.9401
    @letmebe.9401 2 ปีที่แล้ว

    How is it flexed without using d-flex?

  • @matteomazzone4098
    @matteomazzone4098 2 ปีที่แล้ว

    Using The zoom is confusing AF. Why not Chrome dev mode?

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

    What to do to bring gap between them?

  • @zitansalehin6941
    @zitansalehin6941 3 ปีที่แล้ว

    How to use xs?.. can't work col-xs-#

  • @yaiirable
    @yaiirable 2 ปีที่แล้ว

    i thought the cherno had switched from c++

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

    Where's part two?

  • @jutublizard
    @jutublizard 3 ปีที่แล้ว

    Adrian Biały Ser :D

  • @RealMehedi
    @RealMehedi 3 ปีที่แล้ว

    Is Mr. Beast your brother?

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

    I thought he was Mr. Beast for a second.😂

  • @dominicdeheuer937
    @dominicdeheuer937 2 ปีที่แล้ว

    I thought you also taught on Udemy?

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

    Mrbeast looks like you :)

  • @milkmeapollo9048
    @milkmeapollo9048 2 ปีที่แล้ว

    After watching this I think I just come to terms that front end development just sucks and is confusing

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

    O-Tho -_-

  • @faridagl
    @faridagl 2 ปีที่แล้ว

    Couldn't focus on anything except your hands, moving all the time.

  • @maweryoutube9852
    @maweryoutube9852 2 ปีที่แล้ว

    I like the content, but I did not like that you kept moving your head, body, and hands all the time which distracted me and made me not to be able to follow you during the video. Please try not to move and that will be better for all.

  • @vidit1001
    @vidit1001 3 ปีที่แล้ว

    Pls pls pls dont shake yourself too much

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

    Too fast.

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

    you write too fast man

  • @rivazmardani
    @rivazmardani 2 ปีที่แล้ว

    thx mate

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

    Thanks !