Объединить атрибуты CSS и псевдоэлементы?

Как я могу объединить селектор псевдоэлементов (:after) с селектором атрибутов ([title])?

Я попытался использовать div[title]:after, но это не работает в Chrome.

HTML:

<div title="foo">This div has a title.</div>
<div>This div does not have a title.</div>

CSS

div:after {
    content: "NO";
}
div[title]:after {
    content: "YES";
}

Демо: http://jsfiddle.net/jmAX6/

Он показывает мне "ДА" в конце каждого из этих div, когда он должен показывать "NO" после второго div.

Я запускаю Chrome 17.0.963.38. Кажется, что он отлично работает в Safari 5.1.2.

ОТВЕТЫ

Ответ 1

Это выглядит как ошибка, которая, наконец, была сообщена. Если вы добавите правило CSS для div[title] в любом месте вашей таблицы стилей с хотя бы одним объявлением, ваше правило div[title]:after будет волшебным образом применяться. Например:

div:after {
    content: "NO";
}
div[title] {
    display: block;
}
div[title]:after {
    content: "YES";
}

Смотрите обновленную скрипту.

Кажется, что это связано с тем, что ваш второй div имеет или не имеет определенных HTML-атрибутов, как показано в комментариях ниже.