I'm kind of debating on which way to do this, and I'm hoping for some input.
Would you guys and gals use a :not() pseudoclass, write a class for a default and then overwrite it, or go back through the entire site to add a class name?
I understand that :not() isn't going to work with < IE8, but I'm getting to a point where I can ignore browsers that old.
[
caniuse.com...]
But I also remember reading once that pseudoclasses were a LOT slower and should be avoided. But I use :hover and :focus a lot, and :after to clear floats, so that ship might have already sailed.
So my options are:
// option 1, :not() pseudoclass
label:not([for]) {
display: inline-block;
padding: 3px 0;
width: 50%
}
// option 2, write it once FOR and overwrite it for NOT
label {
display: inline-block;
padding: 3px 0;
width: 50%
}
label[for] {
display: inline !important;
padding: 0 !important;
width: auto !important
}
// option 3 requires going back through the site and finding each one to change
label.foo {
display: inline-block;
padding: 3px 0;
width: 50%
}
Which would you use? Or would you do something else entirely?
