Size of zero pixels in CSS with or without 'px

Question

This question already has an answer here:

• 'property: 0' or 'property: 0px' in CSS? 9 answers

Googling for the answer to this question has proven difficult so I figured somebody here should know.

Within CSS, I've seen zero pixels declared as simply '0' yet also as '0px'.

mystyle { width: 0; }

anotherstyle { width: 0px; }

The minor problem with '0' is that if you change it to some non-zero value, you might forget to add the 'px'. And when making a value '0', you may forget to remove the 'px'. I want pure consistency in my code and little things like this drive me nuts.

Does this really come down to a personal preference like where to indent?

They both seem to work but which way is better and why?

Thank-you.

---

EDIT for clarity:

I wrote "little things like this drive me nuts".

Not having a "px" for 0 is not what I was referring to.

It drives me nuts that there are two different ways of doing the same simple thing.

Personally, despite the minor issue of forgetting to add/remove 'px' where appropriate, I'll continue using '0' by itself knowing it's just as acceptable as the other way.

Answer 1

I always use 0 (without units), unless I want to explicitly set the units, simply because it's shorter. The important thing is to be consistent.

Answer 2

They are identical.

Use width: 0, because it is shorter and more readable.

Especially when you have, for example:

padding: 0px 0px 9px 8px

vs

padding: 0 0 9px 8px

See the specs:

The format of a length value (denoted by <length> in this specification) is a <number> (with or without a decimal point) immediately followed by a unit identifier (e.g., px, em, etc.). After a zero length, the unit identifier is optional.

---

The minor problem with '0' is that if you change it to some non-zero value, you might forget to add the 'px'. And when making a value '0', you may forget to remove the 'px'

This does not happen once you get into the habit of writing 0 without the unit identifier.

Answer 3

If you are using several type of CSS units (%, em, inch…) in your stylesheet you'd better keep the intended one (in your case px).

On a side note, remember that the keyword none doesn't necessarily redirect to 0 (even if visually it has the same result).

Answer 4

I think 0 is 0 no matter what you have after it. 0% of something would be the same as 0 pixels of something. I think...at least that is how I think about things, and multiplication seems to agree with me.