I did some testing with this chunk of css, which according to w3schools.com are valid css rules.
/* tests for column styles */ .test1 { column-width: 10px; column-rule-width: 5px; column-rule-style: double; column-rule-color: #deface; column-count: 3; column-fill: balance; column-gap: 10px; column-span: 1; } .test2 { column-width: auto; column-rule-width: medium; column-rule-style: none; column-rule-color: black; column-count: auto; column-fill: auto; column-gap: normal; column-span: all; } .test3 { columns: 10px 3; column-rule: 5px double #deface; } .test4 { columns: auto auto; column-rule: medium none black; }
/* tests for border styles */ .test5 { border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-left-radius: 5px 3px; border-bottom-right-radius: 5px; border-image-source: url(cats.jpg); border-image-slice: fill; border-image-width: auto; border-image-outset: 30 30; border-image-repeat: round; } .test6 { border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-left-radius: 0; border-bottom-right-radius: 0; border-image-source: none; border-image-slice: 100%; border-image-width: 1; border-image-outset: 0; border-image-repeat: stretch; } .test7 { border-radius: 5px 3px; border-image: url(cats.jpg) fill auto 30 30 round; } .test8 { border-radius: 0 0; border-image: none 100% 1 0 stretch; }
/* tests for transition styles */ .test9 { transition-property: width; transition-duration: 5s; transition-timing-function: cubic-bezier(0.2,0.3,0.4,0.5); transition-delay: 2s; } .test10 { transition-property: all; transition-duration: 0; transition-timing-function: ease; transition-delay: 0; } .test11 { transition: width 5s cubic-bezier(0.2,0.3,0.4,0.5) 2s; } .test12 { transition: all 0 ease 0; } /* tests for transform properties */ .test13 { transform: rotate(-12deg); transform-style: preserve-3d; transform-origin: left bottom 5px; } .test14 { transform: none; transform-style: flat; transform-origin: 50% 50% 0; }
I did some testing with this chunk of css, which according to w3schools.com are valid css rules.
/* tests for column styles */
.test1 {
column-width: 10px;
column-rule-width: 5px;
column-rule-style: double;
column-rule-color: #deface;
column-count: 3;
column-fill: balance;
column-gap: 10px;
column-span: 1;
}
.test2 {
column-width: auto;
column-rule-width: medium;
column-rule-style: none;
column-rule-color: black;
column-count: auto;
column-fill: auto;
column-gap: normal;
column-span: all;
}
.test3 {
columns: 10px 3;
column-rule: 5px double #deface;
}
.test4 {
columns: auto auto;
column-rule: medium none black;
}
/* tests for border styles */ top-left- radius: 5px; top-right- radius: 5px; bottom- left-radius: 5px 3px; bottom- right-radius: 5px; image-source: url(cats.jpg); image-slice: fill; image-width: auto; image-outset: 30 30; image-repeat: round; top-left- radius: 0; top-right- radius: 0; bottom- left-radius: 0; bottom- right-radius: 0; image-source: none; image-slice: 100%; image-width: 1; image-outset: 0; image-repeat: stretch;
.test5 {
border-
border-
border-
border-
border-
border-
border-
border-
border-
}
.test6 {
border-
border-
border-
border-
border-
border-
border-
border-
border-
}
.test7 {
border-radius: 5px 3px;
border-image: url(cats.jpg) fill auto 30 30 round;
}
.test8 {
border-radius: 0 0;
border-image: none 100% 1 0 stretch;
}
/* tests for transition styles */ property: width; duration: 5s; timing- function: cubic-bezier( 0.2,0.3, 0.4,0.5) ; property: all; duration: 0; timing- function: ease; 0.2,0.3, 0.4,0.5) 2s;
.test9 {
transition-
transition-
transition-
transition-delay: 2s;
}
.test10 {
transition-
transition-
transition-
transition-delay: 0;
}
.test11 {
transition: width 5s cubic-bezier(
}
.test12 {
transition: all 0 ease 0;
}
/* tests for transform properties */
.test13 {
transform: rotate(-12deg);
transform-style: preserve-3d;
transform-origin: left bottom 5px;
}
.test14 {
transform: none;
transform-style: flat;
transform-origin: 50% 50% 0;
}