title: Center align 'list group item' within Card in Bootstrap 4 Alpha 6?
body: <p>Does anyone know how to align the 'list-group-item' within Bootstrap 4 Alpha 6 update? I can add text-center to the card itself, which centrally aligns the card header and links, however the list group doesn't move.</p>
  
  <p>I've tried the mx-auto class, this moves the text centrally, however the border is shrunk to only fit the text so looks out of place</p>
  
  <p><a href="https://i.stack.imgur.com/dgQ98.png" rel="nofollow noreferrer">Example of card text center issue</a>.</p>
  
  <p>This is the code I've been testing on:</p>
  
  <pre><code>&lt;div class="card" style="width: 20rem;"&gt;
    &lt;img class="card-img-top" src="..." alt="Card image cap"&gt;
    &lt;div class="card-block"&gt;
      &lt;h4 class="card-title"&gt;Card title&lt;/h4&gt;
      &lt;p class="card-text"&gt;Some quick example text to build on the card title and make up the bulk of the card's content.&lt;/p&gt;
    &lt;/div&gt;
    &lt;ul class="list-group list-group-flush"&gt;
      &lt;li class="list-group-item"&gt;Cras justo odio&lt;/li&gt;
      &lt;li class="list-group-item"&gt;Dapibus ac facilisis in&lt;/li&gt;
      &lt;li class="list-group-item"&gt;Vestibulum at eros&lt;/li&gt;
    &lt;/ul&gt;
    &lt;div class="card-block"&gt;
      &lt;a href="#" class="card-link"&gt;Card link&lt;/a&gt;
      &lt;a href="#" class="card-link"&gt;Another link&lt;/a&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>