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 CSS Basics (2014) The Box Model Display Values

Keith Greatz
Keith Greatz
4,377 Points

When adding multiple values where should unit (px) be placed.

Following the vid My code for my Listed items was

li {
display: inline-block;
padding: 0 12px;
border-right: 1px solid;
margin: 80 0px;
}

The top margin for it didn't work, I found when i corrected the margin to be,

margin: 80px 0;

it then worked.

My question is How come the padding can be written with the pixel on the second value and work but when it comes to the margin I needed to add the unit to the first value?

As I type this I am assuming it has something to do with the margin being 0? Margins with 0 don't need a px value?

IF anyone can help me with how I can post my code on the black background like others do that would be handy also.

Thanks

2 Answers

Darren Joy
Darren Joy
19,573 Points

That's what I would assume too, the zero might be universal. Since sizes can be in px, or em, or %

zero for all of those tings is still zero, but any number requires a unit of measure to determine it from px or em or whatnot...

Isaiah Marin
Isaiah Marin
11,971 Points

Hi Keith,

Also be aware of the order when you apply those values (in case you are not familiar with it). It goes as Top Right Bottom Left An Example: padding: 10px 15px 30px 35px

Note: 10px goes to Top, 15px goes to the Right, and etc..

Also to add snippets to your answers or questions I'd like to refer you to the video, "Tips for asking questions." You can find the video on the right hand side of the any Webpage with a question (like this one).