title: Validation for Select elements of React-Bootstrap are mis-aligned
body: <p>I'm using React-Bootstrap (note: we're on the relatively new v1.0.0 !)</p>
  
  <p>I can add validation to my forms rather nicely, but it doesn't play well with Select dropdowns:</p>
  
  <blockquote>
    <p><a href="https://i.stack.imgur.com/7HvAP.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/7HvAP.png" alt="enter image description here"></a></p>
  </blockquote>
  
  <p><strong>How do I fix this?</strong>
  Is the only option to figure what manual css to layer onto the Controls, to re-locate the validation icons?</p>
  
  <p>Code:</p>
  
  <pre><code>  &lt;Form validated&gt;
      &lt;Form.Group&gt;
        &lt;Form.Label&gt;Text Input&lt;/Form.Label&gt;
        &lt;Form.Control required type="text" value="foo"/&gt;
      &lt;/Form.Group&gt;
      &lt;Form.Group&gt;
        &lt;Form.Label&gt;Invalid Dropdown Input&lt;/Form.Label&gt;
        &lt;Form.Control required as="select" value={''}&gt;
          &lt;option key={'empty'} value={''}&gt;...&lt;/option&gt;
          &lt;option key={'1'} value={'1'}&gt;1&lt;/option&gt;
          &lt;option key={'2'} value={'2'}&gt;2&lt;/option&gt;
        &lt;/Form.Control&gt;
      &lt;/Form.Group&gt;
      &lt;Form.Group&gt;
        &lt;Form.Label&gt;Valid Dropdown Input&lt;/Form.Label&gt;
        &lt;Form.Control required as="select" value={'2'}&gt;
          &lt;option key={'empty'} value={''}&gt;...&lt;/option&gt;
          &lt;option key={'1'} value={'1'}&gt;1&lt;/option&gt;
          &lt;option key={'2'} value={'2'}&gt;2&lt;/option&gt;
        &lt;/Form.Control&gt;
      &lt;/Form.Group&gt;
    &lt;/Form&gt;
  </code></pre>