In this tutorial I show you how to put a grid inside of a grid, this is called “nesting a grid” but it really should be called “Grid inception”
Don’t forget to subscribe:
Follow me on Twitter:
Follow me on Facebook:
Feel free to donate:
Link to this post!
39 responses to “Bootstrap tutorial 6 – Nesting the grid”
I literally had to rearrange my div tags to make it work wrong so I can follow your tutorial of the way NOT to do it. You know your stuff, thx for the tut
Thank for the video bro! If i write <div class="col-lg-12 bg-success"> i can't get 100% width and background color. I know Bootstrap changed but can you help me?
should you have 1 container for every page or many containers for every row of your page..cant find any tuts on spacing out the rows ..do you just use css margin-top etc , to stack rows on top of each other and space the content out?
my boss just told me to create the same website in bootstrap ! i only prepped for html css , but just starting to get bstrap
This is aweson.. thank you
When I do this with multiple nested columns, they stack rather than display inline, why is this?
If you aren't able to see the result of col-xs-* it's because in Bootstrap 4 it has changed to simply col-*
Inception does not mean recursion or nesting. Even though the movie "Inception" dealt with dreams within dreams, it was referring to placing an idea in someones head. It was talking about the inception, or starting point of the idea.
Reading these things on tutorial sites and watching someone explaining these things to you are two different experiences. Thank you for providing clarity on this , looking forward to learning more from you ….Also i can hear that fellow South African Accent
Great practical way of teaching it, through concrete examples, which so many don't do!
Thanks, this tutorial helped me understand the concept and i was able to resolve the issue in my project.
Thanks for the tutorial Quentin!
You should check out LiveReload for Sublime Text, it will auto refresh your browser after each save. It helped me a lot!
Excellent! Nothing on the internet that teaches this better!
Your tutorials are amazing and so easy to understand! They've helped me a lot. Thank you for making a difference and contributing to the society! 😀
This shit is confusing as a motherfucker. Makes me want to just use pure CSS for all my positioning,columns,grids and containers.
you are one of the best teachers I have ever seen and I have watched many tutorials
This vid is great. But the way you are explaining is super confusing.
its so sweet video….Thnx…Bryant Vali
MO = " inception";
Wonderful breakdown of the grid structure for bootstrap. Thanks a lot 🙂
Instead of messing with adding a row inbetween a parent and class, why not just overwrite the padding parameter directly within the div and avoid all the headaches if one wants to achieve that effect?
Great series … but how is the opacity of the background done? I tried to use a different class but it isn't working.
im d second to comment that this one is not quentin… lol
These are very helpful tutorials. I've read and heard many times that building websites with Bootstrap is easy and fast, but that has not been my experience. I have struggled with understanding how it works and creating my site to look the way I want it to within the Bootstrap framework. It seems like every time I try to do the simplest thing with the site it either doesn't work or lots of other parts of the site "break". You are clearing up a lot of issues for me, Quentin. Thanks for putting this series together and making it easy to understand.
Thank you very much Quintin. You solved the problem that I was struggling for three days. Much appreciated.
Nice tutorial dude thx
he is not quentin
Hi quintin bro. I do not like the margin. How could get rid off the margin? Thanks!
I allways find the right answers to my problems in your tutorials, thank you so much! Subd.
please, use fullscreen. Or zoom in. I sometimes have to use fullscreen to see something. Im using laptop.
Amazing job man! Subscribed already!
Thank you! I think you were having a cold. 😛 Nice job man!
These BootStrap Videos are Essential as I am integrating design so easily with the functionality of my Projects! Making a Difference Quentin!
Going good so far keep up the hard work!
+1 Finding the tuts really informative.
This is Awesome… In fact this was something I was looking for. Great Help Quentin Watt.