Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

CSS

Joseph Hall
Joseph Hall
10,865 Points

Using flexbox to align last child with rest of grid

Hi Guys,

I'm building a collection of items (see screenshot) in flexbox, but the last item "Steve Stricker" is all the way on the right. I'd like it to appear in the second column.

Screenshot: https://www.dropbox.com/s/z7aedmyv7sjl9j0/Screen%20Shot%202017-07-30%20at%203.15.36%20PM.png?dl=0

Here's my code:

.videos{ padding:8px 0px 40px 0px; display:flex; align-items:center; max-width:1200px; flex-direction: row; flex-wrap:wrap; justify-content:space-between; }

inside of the videos div, there's a div for each video.

  • Joseph

1 Answer

Ezra Siton
Ezra Siton
12,644 Points

Hi. in the future Markdown your code.

https://teamtreehouse.com/library/code

This is not "last child" issue. But space-between. Remove this declaration and thats it :) (Default value: flex-start)

justify-content:space-between;

space-between: items are evenly distributed in the line; first item is on the start line, last item on the end line

flex-start (default): items are packed toward the start line