title: How do I make a placeholder for a 'select' box?
body: <p>I'm using placeholders for text inputs which is working out just fine. But I'd like to use a placeholder for my selectboxes as well. Of course I can just use this code:</p>
  
  <pre><code>&lt;select&gt;
      &lt;option value=""&gt;Select your option&lt;/option&gt;
      &lt;option value="hurr"&gt;Durr&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p>But the 'Select your option' is in black instead of lightgrey. So my solution could possibly be CSS-based. jQuery is fine too.</p>
  
  <p>This only makes the option grey in the dropdown (so after clicking the arrow):</p>
  
  <pre class="lang-css prettyprint-override"><code>option:first {
      color: #999;
  }
  </code></pre>
  
  <p>The question is: How do people create placeholders in selectboxes? But it has already been answered, cheers.</p>
  
  <p>And using this results in the selected value always being grey (even after selecting a real option):</p>
  
  <pre class="lang-css prettyprint-override"><code>select {
      color: #999;
  }
  </code></pre>