title: text-center for input-group-addon breaking
body: <p>I have a text input and some input-group-addon elements attached to it.  It looks by default, but when I try to center align with text-center, only the input moves over but not the input-group-addon which stays left aligned and looks completely wrong.</p>
  
  <p>I tried center-block but it does even less (doesn't center either components).  I tried wrapping in other divs but no luck.  I am very new to css so apologies if this is very obvious!!</p>
  
  <pre><code>&lt;div class="text-center"&gt;
    &lt;div class="input-group"&gt;
      &lt;span class="input-group-addon" id="basic-addon1"&gt;&lt;/span&gt;
      &lt;span class="input-group-addon" id="basic-addon2"&gt;&lt;/span&gt;
      &lt;span class="input-group-addon" id="basic-addon3"&gt;&lt;/span&gt;
      &lt;input id="password-input" type="password"&gt;
      &lt;button id="password-submit" class="btn btn-default"&gt;Submit&lt;/button&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>fiddle: <a href="https://jsfiddle.net/m0L2cofg/2/" rel="nofollow noreferrer">https://jsfiddle.net/m0L2cofg/2/</a></p>
  
  <p>Thanks</p>