title: Using CSS only, is it possible to make a UL list have no bullet when it has only one item?
body: <p>Is it possible to use CSS only, to have a solution that works even on IE8, that</p>
  
  <ol>
  <li>when a <code>&lt;ul&gt;</code> list has 2 or more items, then keep the bullets in front of the items as usual.</li>
  <li>when there is only 1 item, then don't show the bullet, because it can be strange that a single item has a bullet in front of it.</li>
  </ol>
  
  <p>An example is shown on  <a href="http://jsfiddle.net/SzQL6/37/" rel="nofollow">http://jsfiddle.net/SzQL6/37/</a></p>
  
  <pre><code>&lt;input id="an-input"&gt;
  &lt;ul id="the-list"&gt;
      &lt;li&gt;error msg 1&lt;/li&gt;
      &lt;li&gt;error msg 2&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>(The error messages should be left-aligned with the left edge of the input box above the error messages, when there are bullets and when there is no bullet.)</p>
  
  <p>Using JavaScript, I could do it: <a href="http://jsfiddle.net/SzQL6/40/" rel="nofollow">http://jsfiddle.net/SzQL6/40/</a></p>
  
  <p>But can this be done by CSS only (and that it can work on IE8)?</p>