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 How to Make a Website Styling Web Pages and Navigation Build Navigation with Unordered Lists

Euan Burton
Euan Burton
3,037 Points
Posted by Euan Burton
Euan Burton
3,037 Points

Concerning syntax of declarations.

i recently corrected an error made much earlier in my main.css code that i only noticed after applying changes to the header in my current lesson. I corrected the code by changing this

nav { text-align: center; padding: 10px, 0; margin: 20px, 0, 0; }

to this...

nav { text-align: center; padding: 10px 0; margin: 20px 0 0; }

I understand now that I was not supposed to use the commas, but i'm curious if using the commas could actually be used for some purpose in such declarations.

what were the commas doing to the code?

2 Answers

Kidist Admasu
Kidist Admasu
11,020 Points

commas are used to separate values of same type. for example font-family: sans-serif, 'changa one'; here it means use the first font family and if not available go to the next one. but we don't use commas when declaring values of different type. for example in your senario padding: 10px 0; is a short hand of

padding-top: 10px;
padding- bottom: 10px;
padding-right: 0px;
padding-left: 0px;
Máté Végh
Máté Végh
25,607 Points
Máté Végh
Máté Végh
25,607 Points

Hi Euan,

In CSS there are some cases where you should not, and some where you should use commas between values. It depends on what property you specify the values for.

In your case, the only way is to not include commas, otherwise it will break the code.

However, as I said there are some cases where you need to separate the values with commas. For instance: nav { font-family: Helvetica, Arial, sans-serif; }

As you learn more, you will get into it!