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 trialKailash Seshadri
3,087 PointsDifference between inline, block and inline block
What is the difference between inline, block and inline block?
2 Answers
James Copeland
12,550 PointsInline - elements that take up only as much space as needed and can fit around other elements on the same line. For example, link elements (a) will fit on the same line as other text and will not show up on a new line nor take more space than is needed.
block - A block element will take up the full width available to it by default, which does not allow for other elements to appear on the same line.
inline-block - Like inline elements but can also have a width and a height to separate itself from nearby elements. Can appear on the same line as other elements by default, though inherits some properties of a block (given that it can have a width and height).
Konrad Pilch
2,435 PointsI agree with James. I just wanted to add, if i make a menu, i would use inline-block, or some navigation of a kind. If im making a vertical menu, like for the footer, i will put this in block, so it stacks up. Inline? i dont use it often, if not at all.
Kailash Seshadri
3,087 PointsKailash Seshadri
3,087 Pointsthanks