title: Select the first element by a specific set of values of the same attribute
body: <p>I need a CSS selector that returns me the first element (or all of them in the correct order) by a specific set of values of the same attribute.</p>
  
  <p><strong>A bad example, but you'll get the idea:</strong></p>
  
  <pre><code>input[type=text][type=email][type=number]:first
  </code></pre>
  
  <p><strong>From this example HTML:</strong></p>
  
  <pre><code>&lt;input type="date" /&gt;
  &lt;input type="email" /&gt;
  &lt;input type="text" /&gt;
  &lt;input type="password" /&gt;
  </code></pre>
  
  <p><strong>The selector must select</strong> <code>&lt;input type="email" /&gt;</code> <strong>or</strong> </p>
  
  <pre><code>&lt;input type="email" /&gt;
  &lt;input type="text" /&gt;
  &lt;input type="password" /&gt;
  </code></pre>
  
  <p>It's ok to return all of them. But they must be in the original order. For example:</p>
  
  <pre><code>input[type=text], input[type=email], input[type=number]
  </code></pre>
  
  <p>Is not suitable as it selects elements in the wrong order. First all <code>type=text</code>, then <code>type=email</code> etc.</p>