Use a wildcard in CSS selector to style when value is present

css, wildcard

Solution

<input type="text" value="">
<input type="text">

input[value]{
  background: #ccc;
}

Try it yourself https://jsfiddle.net/55rjf0y8/

Problem

I am trying to style an element only when that element has a value attribute. The value attribute is variable (it's a date), but it's the only thing that changes between "no value" and "has value" which I need to style differently. Is it possible to use a wildcard in the CSS selector ascertain whether the value attribute is present? E.g: HTML ``` <input class="thing" value="variable-something">...</input> <input class="thing">...</input> ``` CSS ``` .thing[value="*"] { ... } OR .thing[value=*] { ... } ``` I've tried this solution but use of the `"` makes it look for a specific string. Doing `.thing[value=*]` is invalid and won't compile. Any advice?

Original source