ansaurus

Question

Answer 1

+3 A:

This is not possible with CSS selectors. But you could use two classes instead of one, e.g. status and important instead of status-important.

Gumbo 2010-07-26 20:23:45

Answer 2

+1 A:

You can't do this no. There is one attribute selector that matches exactly or partial until a - sign, but it wouldn't work here because you have multiple attributes. If the class name you are looking for would always be first, you could do this:

<html>
<head>
<title>Test Page</title>
<style type="text/css">
div[class|=status] { background-color:red; }
</style>
</head>
<body>
<div id='A' class='status-important bar-class'>A</div>
<div id='B' class='bar-class'>B</div>
<div id='C' class='status-low-priority bar-class'>C</div>

</body>
</html>

Note that this is just to point out which CSS attribute selector is the closest, it is not recommended to assume class names will always be in front since javascript could manipulate the attribute.

SBUJOLD 2010-07-26 20:30:48

yeah, thought of that. It might become an issue when jQuery gets into picture, since it might insert a class at the front.

2010-07-26 20:46:42

Yeah I'll edit my post to make it clear it clearly isn't a recommended way of doing it. If you have control over the class names then Gumbo's suggestion definitely would be the way to go (plus attribute selectors on older IE browsers is not supported).

SBUJOLD 2010-07-26 21:20:55

ansaurus

tags:

views:

answers:

css selector by class prefix

related questions