Using units on CSS perspective

Question

Just a quick question to clear up some confusion that I have regarding units on CSS perspective.

On the CSS Transforms spec it references it with px e.g. perspective: 1000px; but I have used and in many other places others have used it without px e.g. perspective: 1000; such as on W3Schools.

Is either way more preferred? Does it matter?

Just want to clear this up, thanks.

Answer 1

Just because it's accepted by (some) browsers doesn't mean it's correct. Specifying a unit of measurement is required by the CSS spec, unless the value is zero.

The spec says:

Lengths refer to distance measurements and are denoted by <length> in the property definitions. A length is a dimension. A zero length may be represented instead as the <number> ‘0’. (In other words, for zero lengths the unit identifier is optional.)

A dimension is a number immediately followed by a unit identifier.

(emphasis mine)

See the Distance Units and the Other Units for examples.

Also see the MDN discussion of length

Answer 2

px (or other absolute unit) is the correct way. Here is documentation (better than w3 schools) :)

https://developer.mozilla.org/en-US/docs/CSS/perspective