pery mimon
pery mimon

Reputation: 8315

How to create css selector that target element with attr that not empty

It's easy to target button#1 with button[data-state] but how can I target the other two with another one selector.

<button id=1 class=notify data-state> some text </button>
<button id=2 class=notify data-state="downloading"> some text </button>
<button id=3 class=notify data-state="render"> some text </button>

I am looking for a selector that can target attribute that is not empty. How can this be done?

Upvotes: 0

Views: 65

Answers (1)

Gerard
Gerard

Reputation: 15786

button[data-state]:not([data-state=""]) {
  background-color: red;
}
<button id=1 class=notify data-state> some text </button>
<button id=2 class=notify data-state="downloading"> some text </button>
<button id=3 class=notify data-state="render"> some text </button>

Upvotes: 2

Related Questions