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 Basics (2014) Basic Layout box-sizing and max-width

Posted by Darren Frenkel
Darren Frenkel
Courses Plus Student 228 Points

How could you add a margin to the img, it's a display: inline; by default. Margins shouldn't effect img elements.

You mentioned in a previous video that images are display: inline by default and margins have no effect on inline elements. However, in this video you added a margin to an image and it worked even though you didn't change the default display for the image.

2 Answers

Jennifer Nordell
seal-mask
STAFF
.a{fill-rule:evenodd;}techdegree
Jennifer Nordell
Treehouse Teacher
Jennifer Nordell
.a{fill-rule:evenodd;}techdegree
Jennifer Nordell
Treehouse Teacher

An image's default display type isn't inline... it's inline block. Not sure if he said it incorrectly in the video or if you heard it incorrectly. Here's the documentation from w3c. https://www.w3.org/TR/html-markup/img.html

Darren Frenkel
Darren Frenkel
Courses Plus Student 228 Points

Hey Jennifer, thanks for that. Though, i've manually changed an img elements display to inline and I was still able to add margin. Plus I was able to add margin to stand alone link, which should be inline by default. Though I wasn't able to add margin to links within a line of text. It seems to me that the rule of not being able to add top/bottom margin to inline elements are only for elements within a line of text.

Daniel Kip
Daniel Kip
5,922 Points
Daniel Kip
Daniel Kip
5,922 Points

I had the exact same question. I thought images were by default inline elements as well. In the case of links, i'll test this later. But maybe if you want to add top or bottom margins to the anchor element, i think the best practice would be to add a display: inline-block;, right?