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 CSS Grid Layout Introducing Grid Layout Add Gutters Between Rows and Columns

Owa Aquino
Owa Aquino
19,277 Points
Posted by Owa Aquino
Owa Aquino
19,277 Points

Question on grid-gap

I'm just wondering if the defined width for the parent container be adjusted based on the added grip gap? and will the grid items width will still be the same?

In the example, Guil set the parent max-width to 800px and let us say he also added a 20px grid gap for the column will this be added to the parent width? ( will the parent become 860px?)

2 Answers

Denis Omeroviฤ‡
.a{fill-rule:evenodd;}techdegree
Denis Omeroviฤ‡
Full Stack JavaScript Techdegree Student 2,607 Points

No, the parent will stay at 800 px. The gap will take 20px from column inside the container, or if there is a multiple columns gap is going to be 20px after every column except the last one. The last column will stick to the edge of the container. First and the last column will always stick to the edge of the container unless you give them a margin.