Bootstrap Grid System The Complete Guide - In Action

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

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

  • @NarutoUzumaki-b6i
    @NarutoUzumaki-b6i 3 หลายเดือนก่อน +1

    Seriously the explanation is awesome....I had watched so many videos for this concept...no one can explain this much Clearly....❤️✨

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

      Happy to help

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

    My goodness, this video was a saving grace man!!! Well organised and explained the concept of bootstrap short and concisely most importantly on point !!

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

    I think this is the best bootstrap grid system tutorial on TH-cam, well explained thank you !

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

    Thank you! So many tutorials out there are just like
    "So you have these letters. Its for responsive design. Here is the table." and then never telling you wtf is it the table about or how is it used for...

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

    Great tutorial, The best illustration of Bootstrap grid system that I've seen on TH-cam. cheers

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

    oh man, it cannot be any more crystal clearer than this. Well explained, thank you so much keep up the good work man

    • @DailyTuition
      @DailyTuition  4 ปีที่แล้ว

      Most welcome 😊 keep supporting

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

    Thank you so much. This is exactly what I needed. Very simple and concise explanation of the basics. You saved me!

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

    What an explanation most underrated video on bootstrap basics.

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

    Best video for Grid system in bootstrap

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

    Brilliant explanation. I was searching for this explanation but this is the best video which explained how to use sm,md-lg with col size. I would say this is the best explanation of Bootstrap Layout system.

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

    Perfect tutorial!
    Better than what I would expect from any tutorial

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

    Thank a lot boss.this tutorial is saving me job..for sur

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

    Wonderful tutorial, I shall watch it a few more times while experimenting at the same time. Great work, keep it up. Thank you.

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

      Experiment makes you feel more comfortable

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

    Very very nice buddy. I have been trying to understand this from past few days. Now it is 100% clear. Thank you very much.

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

    finally i understand this concept just because of you great content and great explanation thank you so much.

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

    The clearest explanation! Thank you!

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

    Thank you so much! :) This is the best tutorial I've seen by far (And I've seen a lot, lol)

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

    this one made me understand the grid content kudos man!!!!

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

    Good job, one of the best explanations I have seen on youtube. Keep up the good work.

  • @anwars.9195
    @anwars.9195 ปีที่แล้ว

    You are awesome, thank you for your explanation! Greetings from Costa Rica

  • @priyankshah1024
    @priyankshah1024 4 ปีที่แล้ว

    Best video on Bootstrap Grid System!..

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

    I bought a 10 dollar udemy course to understand this, clearly the money should've gone to you brotha 👊 any way to make a donation for your free lesson?

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

      Thank you for your donation. Appreciate 🙏

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

      There's a paypal link in the description ;)

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

      Thank you for supporting us 💗

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

      LOL me too.

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

    Thank you so much. It always confused me so much!

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

    best one I've seen so far!!

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

    Wonderful, best video, explained very nicely and made so easy to understand

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

    Thank you, you really clarified a lot for me.

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

    You are great...really thank u very much👏👏👏👏

  • @TarunKumar-ip2vt
    @TarunKumar-ip2vt ปีที่แล้ว

    Thanyou for clearing basics of columns and row

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

    good one

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

    there's always an Indian guy who saves your ass from cs topics! :p
    Thanka a ton man!

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

    Good.....Clear Explanation.

  • @kirankumar-ye9el
    @kirankumar-ye9el 3 ปีที่แล้ว +1

    Nice Explanation, Thank you !

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

    Thank you so much sir, I appreciate the detailed examples

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

    Explained very well

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

    That was an awesome explanantion

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

    This tutorial is💯.

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

    Thanks bro 👍👍👍

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

    great explanation.....

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

    thank you bro, you helped me a lot

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

    Thank you ive learned a lot 😇😇😇

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

    Very useful sir

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

      Thanks and welcome

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

    thank explained a lot thanks for sharing

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

    Great video!

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

    Thanks man really helpful 😊😊

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

    thankyou so much sir🙏🙏😍🙏

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

    Thank you so much sir! Glad I found your video tutorial! It was the best, the clearest illustration of the lesson ever! I just want u to know that you just gained a new subscriber :)

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

    Really helpful. Thank You

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

      Most welcome keep supporting

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

    Thank you for your great explanation

  • @adrenaline.2530
    @adrenaline.2530 3 ปีที่แล้ว +1

    Thank you for making that easy to understand :-)

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

    Best ....thank you.

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

    Very helpful. Thanks for the tutorial!

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

    Nice

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

    Nice Tutorial

  • @ismailaouad9097
    @ismailaouad9097 4 ปีที่แล้ว

    Thank you so muuuuch for your help!!

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

    well explained. Thank You

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

    Thanks a ton Akshay! Great content!

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

    good explanation i never seen

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

    Thankyou ❤

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

    thank you i love you

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

    It is a great tutorial! Thank you!

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

    this is a really good explanation. thank you so much!

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

    Let the God bless you! :-) I got it at least! HUGE thank you!

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

    Thank you this was very helpful!!

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

    thank you ! that was really helpful !

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

    Best

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

    Thank you!

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

    Nicely explained, thank you :-)

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

    Great Video !! Thanks you just gained a sub

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

    Thank you excellent tutorial!!

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

    thanks for this

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

    good explanation :)

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

    thank you so much

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

    nice video.. thank you very much. subscribed too!

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

    Well explained. Keep it up.! 🌟

  • @user-testo21347
    @user-testo21347 3 ปีที่แล้ว

    Nice tutorial ,You have solved my confusion regarding gid system. May I have the color scheme u have used in this tutorial for background color of different cols. Thanx

  • @bishwajitdastutul1589
    @bishwajitdastutul1589 4 ปีที่แล้ว

    Good job, thank you :-)

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

    Super

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

    Thank you I cleared

  • @ayb.s
    @ayb.s 4 ปีที่แล้ว +1

    good job man

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

    THANK YOUUUUUUU :')))!!!!

  • @denmarkagbo3162
    @denmarkagbo3162 5 ปีที่แล้ว

    thx sir good zoom video i see the code and output

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

    using good microphone will be better... ok Nice tutorial

  • @EquipSystem
    @EquipSystem 5 ปีที่แล้ว

    Parabéns pelo vídeo e o seu canal e muito importante e útil!

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

    thx...to the point explanation. What is the difference between class=row and class=d-flex

    • @DailyTuition
      @DailyTuition  5 ปีที่แล้ว

      We use row to create column grid layout and d-flex for flexbox layout. You can achieve the same result using both these classes.

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

      @@DailyTuition Yeha I confuse me as someplace we are using row and at someplace we are using d-flex. I think d-flex gives us the flexibility to layout either in row or column while the row is just row layout. Thanks for the clarification. Your channel got great content.

    • @DailyTuition
      @DailyTuition  5 ปีที่แล้ว

      @@ajeetworking thank you 😊

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

    hi bro,
    you have to changing the class name but how to get background color for all div's

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

    Hello. I have a question, I have a row, and inside is two columns of col-6, so col-6 + col-6 is 12 right? however, the second div keeps getting pushed down to next line. Why is it doing this? What can I do?

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

      Sometime margin and padding add additional space to div so we need to take care of it. Plz remove margin from the .col-6 divs

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

    Very clear.... Thanks, I need a question sir, how can I write you?

    • @DailyTuition
      @DailyTuition  4 ปีที่แล้ว

      On instagram @akki.2013

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

      @@DailyTuition OK I will

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

    how did you change the color automatically

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

    Very nice
    What is the css of this could you plz explain it

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

      bootstrap uses flex box,so u can look it up.

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

      I got it. its nth-child()

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

    how did you add the colors ?

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

    But how does the colour was applied to the column......like where was the code written in your code snippet

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

      The color of the columns is in the css file. Just like you pass background-color in css.

  • @hiep.van.5822
    @hiep.van.5822 3 ปีที่แล้ว +1

    how to change the color of different column ? i don't understand

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

      No. That's different concept. Here we are looking at grid

  • @abiakhil69
    @abiakhil69 5 ปีที่แล้ว

    Sir what is difference between components and dom elements? In react

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

    How to select everyone of these columns in css ?

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

      Couldn't understand will you plz elaborate

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

      @@DailyTuition don't worry anymore, i just set an id for each col to style it in css , thank you for the tutorial 😊

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

    so, if i want 5 columns in a row, what should i code?

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

      Use .col-2 five times and .col-3 one time

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

    Can we declare for one screen and made other as auto fit (by declaring a bootstrap class)?? If possible how??

    • @DailyTuition
      @DailyTuition  4 ปีที่แล้ว

      Yes it's possible. Use bootstrap grid column class for different screen

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

      Can we declare col-md-6 and made other screen (sm, lg) as outfit?? If possible how ? Plz

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

      @@vamsikrishna4166 yes. Use an, lg and ,md classes. Check out my other website design tutorial to Know more about it

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

    how can take the row on php looping with mysql data. when the lot of data make output not in row

    • @DailyTuition
      @DailyTuition  5 ปีที่แล้ว

      Show me first how you want to display data? So I can tell you how to go further...

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

    how to center contents within a div

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

    where is the css how to change the color of different colunmns and is it enough for responsive website

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

      It is enough for layout. Other things would be changed

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

    uno

    dos
    result giving:
    uno
    dos
    result expected:
    uno dos
    Now why is the col giving me row? childrens should be positioned side by side just like a col
    col = im a col
    row = im
    a
    row

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

      You have to put size of the column. Like this.
      .Col-2
      Change the html structure and use this.
      inside that create .col-2 and inside that create div with uno.
      Make sure you create separate div for doc.
      Check this link to learn more
      th-cam.com/video/cHAcSQyvBqQ/w-d-xo.html