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 Flexbox Layout Flexbox Properties Controlling the Direction of Flex Items

Posted by john knight
john knight
Courses Plus Student 9,155 Points

Question about the first unit in the flex box layouts

What's the difference between if we set the value for the display rule to : flex or inline-block.

MAIN QUESTION:::what the difference between the flex display or the inline-block display?.

1 Answer

Steven Parker
Steven Parker
229,786 Points
Steven Parker
Steven Parker
229,786 Points

The "flex" setting primarily affects how child elements will be laid out on the page. It causes the special "flexbox" layout methods to be used for them. The flex container itself is handled like a block element.

The "inline-block" setting affects how this element will be laid out on the page. It allows it to have dimensions (like a block element) but it will be "flowed" (like an inline element).

FYI: there's also an "inline-flex" display setting.