Did you know CSS has over 400 unique properties

Sadick Jun 30 '18 ・1 min read

#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

DISCUSS (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

Author

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

-100

code of conduct - report abuse

Did you know CSS has over 400 unique properties

Sadick Jun 30 '18 ・1 min read

Smart Time Management and Productivity Guide via Weekly Reviews.

Google, Apple and Other Users of Vue.js

Luca Spezzano - Oct 15

Design pattern: JS Functional Chains

Patrick R - Oct 15

Simple iPhone Calculator App using hooks in React Native

Nabendu - Oct 15

The Need of CSS Style Guides

Hoang Nguyen - Oct 15