Reply To: Selecting a CSS Class divided into names

[__]

If you’re asking whether [class^='asset-'] is a valid selector, then the answer is yes. This doesn’t have anything to do with sass, however; it’s a css selector. It works in modern browsers, back to IE8.

However, note that selector will only work when you list the “asset-whatever” class first. If you put some other class first (or end up with another class first somehow, programatically, maybe), then it won’t match.

You could use [class*=asset-] instead, though that would also match things like class=not-an-asset.

To match only asset- classes, wherever they appear in the list, you’d need to do:

[class^=asset-],[class*=' asset-']{
    /* your styles here.
       note the leading space in the *= selector. */
}

I haven’t looked at cross-browser compatibility for the *=leading-space method. Give it a try.

. . . . . EDIT . . . . .

p.s. – regarding the $= rules, that would be very fragile, for all the reasons above – I’d recommend against it. If the styles truly are independent (i.e., all -whatever classes get the same styling, not just asset-whatever classes), you might look at the |= (in-dash-separated-list) selector.