1 - You aren't using the [attr|="value"] correctly. check out: http://www.w3.org/TR/CSS2/selector.html#attribute-selectors - Or to quote:
'Matches any E element whose "lang" attribute has a hyphen-separated list of values beginning (from the left) with "en".'
So you should be selecting like this: h1[rel|="This"]
2 - The second problem is much more tricky to spot. Your hyphens aren't utf8 hyphens, and are therefore breaking.
Here is the code: http://jsfiddle.net/2b7tq/
Can someone tell me, why the attribute selector doesn't style the HTML?
Your rel attribute is not properly selected
See: http://jsfiddle.net/BGjS2/
http://www.last-child.com/rel-attribute-display/
You have two problems with your example.
1 - You aren't using the [attr|="value"] correctly. check out: http://www.w3.org/TR/CSS2/selector.html#attribute-selectors - Or to quote: 'Matches any E element whose "lang" attribute has a hyphen-separated list of values beginning (from the left) with "en".' So you should be selecting like this: h1[rel|="This"]
2 - The second problem is much more tricky to spot. Your hyphens aren't utf8 hyphens, and are therefore breaking.
http://jsfiddle.net/2b7tq/1/
Can I just ask why use rel and not a class or ID?