Note that there are some explanatory texts on larger screens.

plurals
  1. POCSS attribute selector, multiple classes, wildcards applied to one class definition possible?
    primarykey
    data
    text
    <p>Consider the following markup with 2 possibilities:</p> <pre><code>&lt;input class="someclass ng-valid ng-invalid-otherstuff ng-valid-amountdetermined some-other-class"&gt; &lt;input class="someclass ng-invalid ng-valid-otherstuff ng-invalid-amountdetermined some-other-class"&gt; </code></pre> <p>"Amount" is a variable word, this could be anything, "message", "account", anything really. I need to be able to make the distinction in CSS. The attribute selector fails short as it considers the entire attribute value for ^, *, | or even ~. </p> <p>I would need to single out a class, then check if that class is "ng-valid-*determined". It appears to me this is simply not possible using css, or am I missing something?</p> <p>A workaround would be to generate "ng-valid-determined*" but this is exactly what I would like to avoid. Does anyone have any ideas on this? As a clarification, I do not know what the ''someclasses' are, I cannot use them for pinpointing my css selector. The problem is exactly that the class I need could be located anywhere inside the class array.</p> <p>I created a fiddle to visualise the problem, this is of course not the solution as I need to be able to target ng-valid-*determined or ng-invalid-*determined</p> <p><a href="http://jsfiddle.net/mC2EW/" rel="nofollow noreferrer">http://jsfiddle.net/mC2EW/</a></p> <p>Not to be confused with <a href="https://stackoverflow.com/questions/11180757/using-two-css-attribute-selectors-with">using two css attribute selectors with *</a></p> <p>//edit1: simplified the question //edit2: added a fiddle</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload