Implement a new CSS property, 'class'

RESOLVED WONTFIX

Status

()

Core
CSS Parsing and Computation
RESOLVED WONTFIX
6 years ago
6 years ago

People

(Reporter: spammed.user, Unassigned)

Tracking

Trunk
x86
Windows 7
Points:
---

Firefox Tracking Flags

(Not tracked)

Details

(Reporter)

Description

6 years ago
User Agent: Mozilla/5.0 (Windows NT 6.1; rv:10.0) Gecko/20100101 Firefox/10.0
Build ID: 20120118081945

Steps to reproduce:

Many style sheets, especially in CSS3, require the same code to be written multiple times. This can be solved by adding a -moz-class property that would apply to any element with -moz-class:'className'; the class className.

Examples:

@-moz-keyframes {
    0% { -moz-class:'class1'; color:red; }
    20% { -moz-class:'class1'; color:green; }
    40% { -moz-class:'class2'; color:blue; }
    60% { -moz-class:'class2'; color:yellow; }
    80% { -moz-class:'class3'; color:orange; }
    100% { -moz-class:'class3'; color:white; }
}

.class1 {
    /*
     lots of properties and their values
     ...
    */
}
.class2 {
    /*
     lots of properties and their values
     ...
    */
}
.class3 {
    /*
     lots of properties and their values
     ...
    */
}
__________________ (once other browsers support this property):
-moz-some-selector {
    /*
     lots of properties and their values
     ...
    */
}
-webkit-some-selector {
    /*
     lots of properties and their values
     ...
    */
}
-o-some-selector {
    /*
     lots of properties and their values
     ...
    */
}
-ms-some-selector {
    /*
     lots of properties and their values
     ...
    */
}
some-selector {
    /*
     lots of properties and their values
     ...
    */
}

can be shortened to

-moz-some-selector {
    class:'myClass';
}
-webkit-some-selector {
    class:'myClass';
}
-o-some-selector {
    class:'myClass';
}
-ms-some-selector {
    class:'myClass';
}
some-selector {
    class:'myClass';
}
.myClass {
    /*
     lots of properties and their values
     ...
    */
}
I don't think this is a good approach.  There are other approaches under discussion in the CSS working group; see discussion on www-style related to variables and mixins.
Status: UNCONFIRMED → RESOLVED
Last Resolved: 6 years ago
Resolution: --- → WONTFIX
Duplicate of this bug: 720371
And, to be clear, the main reason I think it's a bad approach is that CSS selectors are about matching -- class is one of the things they match on, but they're not intended to be used as only ".class", and selectors aren't anything like "classes" as they work in a programming language.  I think a mechanism like this encourages them to be used that way, which encourages people to avoid a lot of the power of CSS and bloat their markup with large numbers of unnecessary classes.
You need to log in before you can comment on or make changes to this bug.