Did you know CSS has over 400 unique properties

#css #showdev #javascript

I didn't know either until I did this.

var element = document.createElement("div");
var count = 0;
for (var index in element.style) count++;
console.log(count); // 413

Top comments (4)

Rasmus Schultz • Jun 30 '18

You would need to exclude non-CSS object properties to accurately count:

var element = document.createElement("div");
var count = 0;
for (var index in element.style) {
  if (element.style.hasOwnProperty(index)) {
    count++;  
  } else {
    console.log(index); // non-CSS object properties
  }
}
console.log(count);

My browser (Chrome) has 439 ;-)

Sadick • Jun 30 '18

Thanks, i completely overlooked the hasOwnProperty method. Nice catch 👍

Ghost • Jul 1 '18

Can do instead

Object.keys(getComputedStyle(element)).length

know that some properties are only SVG related.

Martin Muzatko • Jul 11 '18 • Edited

-100

DEV Community

Did you know CSS has over 400 unique properties

Top comments (4)

Read next

Hacktoberfest 2024: A retrospective

🎨 All the Colors You Need with Tailwind CSS

Event loop visualiser for lerners

Your Session has Expired !!