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) Enhancing the Design With CSS Web Fonts with @font-face

Posted by Riksha Karma
Riksha Karma
886 Points

margin-top related question ?

Around 8:06 in the video Instructor used margin-top: 150px; to the arrow class. But the the arrow class is defined to img which is inline level element. So, how does margin-top shows effect since inline level element does not support margin top and bottom. thanks in advanced?

3 Answers

Martin Gailius
Martin Gailius
4,685 Points
Martin Gailius
Martin Gailius
4,685 Points

Note that browsers technically use display: inline (as seen in the developer tools) but they are giving special treatment to images. They still follow all traits of inline-block.

Martin Gailius
Martin Gailius
4,685 Points

How much margin-bottom you tried to add

Riksha Karma
Riksha Karma
886 Points
Riksha Karma
Riksha Karma
886 Points

I didn't get the meaning of "special treatment to images" sir. Can you describe it further more sir ? But margin-bottom does not work for the arrow.

Martin Gailius
Martin Gailius
4,685 Points
Martin Gailius
Martin Gailius
4,685 Points

It behaves like an inline element (because it is), but some generalizations about inline elements do not apply to img elements