Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS Framework Basics Build a Website with Bootstrap Content Layout with Nested Grids

Alexander Kapriniotis
Alexander Kapriniotis
25,897 Points

Reason of nesting

Hi, i was wondering what do we achieve by nesting rows inside columns instead of creating two columns at the first place

3 Answers

I think in this situation it is because he wanted the nested row (the img and the descriptive text(get access...)) to hang off of the column above it (learn how to...). This keeps the nested row lined up neat and also lets it float (vertically) under the column that it is nesting from.

you could do it with un-nested rows but you'd have to make it two different sets of rows (1 row of 2 columns over 1 row of four), and then when you re-size the window your information will be all out of order.

You can use columns to layout a page. Say you want two-thirds of the page for your main content and the other third for a sidebar. Usually in layout these two columns have different information, so it begins to make sense to layout your columns first, then rows and other formatting and content inside. Usually one wouldn't start with rows.

I hope this makes sense :-)

Alexander Kapriniotis
Alexander Kapriniotis
25,897 Points

So because the grid system limits us to 12 we create a nested row to expand it with more columns?