Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

CSS

I used padding instead of margin to add space around the floated image. Why was margin the best choice?

In the media query for this exercise, I used this code

.feat-img { width: 300px; float: left; padding: 0px 15px; {

Instead of this code

.feat-img {
    width: 300px;
    float: left;
    margin-top: 5px;
    margin-right: 25px;
    margin-bottom: 25px;

}

1 Answer

Jacob Jackson
seal-mask
.a{fill-rule:evenodd;}techdegree
Jacob Jackson
UX Design Techdegree Student 7,807 Points

Hey Jason!

Super good question!

As you go forward, you'll find that you'll just simply develop preferences. The key difference between padding and margin in this case is that when you use padding on an element, in this case, your image, you should include the dimensions of your padding into the element.

I'll use an example: Let's say your image is 200px x200px and you apply an all around padding of 10px. You could now think of this image as 220px x 220px

Whereas with margin, if you were to do the same thing, you should still think the element as 200px x 200px with 10px of open space around the outside. Keep in mind from your lessons that there are factors that can cause vertical margins to collapse, etc.

So all that just to simply say you're absolutely right in questioning this. Is there a right answer? Nopee! Simply preference. Margin is a great example when learning however because it doesn't throw you the curve ball of having to reinterpret the element when you use it. But both can be used for a visually almost identical result.

Hope this helps! -Jake

Thank you, Jake!