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 trialLuke Kennedy
11,661 PointsAre the image tags inline or inline-block because it seems to respect the margin-top?
.img-featured { float: right; margin: 15px 0 15px 15px; }
I tried using display: inline , display: inline-block and display: block. It seems to be the same results though. The display:inline still respect the top margin. From what I read on https://teamtreehouse.com/community/advantages-of-inline-over-inline-blocks community. the display:inline shouldn't respect the top margin.
If anyone could please enlighten that would be great! :)
1 Answer
David Brener
3,794 PointsHi Luke, So, I'm not sure I understand your question exactly. Images are inline elements but in your CSS you have given the image a defined top margin of 15px. Therefore, your image element will respect the CSS rule, unless you override the rule.
Luke Kennedy
11,661 PointsLuke Kennedy
11,661 PointsHi David,
Thank you for your reply. No worries, I managed to get an answer from stackoverflow and w3schools. I was actually confuse why did the img tags respect the margin-top properties when in the first place I thought it was an inline element.
It's actually because img tags are considered as inline-block element which means that it does respect the margin-top and margin-bottom properties as inline element do not respect the margin-top and margin-bottom properties.