title: Horizontally Center Radio Buttons In Div
body: <p>I'm trying to horizontally center a set of three radio buttons but am not having successs.  </p>
  
  <p>Here's the code I have:  </p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;div class="section-wrap section-flavors"&gt;
          &lt;input id="r11" name="radio3" type="radio" value="radio_btn"  class="flavors-radio"&gt;
     &lt;label for="r11"&gt;&lt;span&gt;&lt;/span&gt;Don't Want&lt;/label&gt;
          &lt;input id="r12" name="radio3" type="radio" value="radio_btn" class="flavors-radio"&gt;
     &lt;label for="r12"&gt;&lt;span&gt;&lt;/span&gt;Don't Care&lt;/label&gt;
          &lt;input id="r13" name="radio3" type="radio" value="radio_btn" checked class="flavors-radio"&gt;
     &lt;label for="r13"&gt;&lt;span&gt;&lt;/span&gt;Want&lt;/label&gt;
   &lt;/div&gt;
  </code></pre>
  
  <p>Here's the CSS I have for it:</p>
  
  <p><strong>CSS</strong></p>
  
  <pre><code>.content .section-wrap {
    background: #f1f8e9;
    padding: 30px;
    overflow: hidden;
  }
  </code></pre>
  
  <p>I've tried adding text-align center and display: inline-block but to no avail.  </p>
  
  <p>I've also checked <a href="https://stackoverflow.com/questions/28945581/how-do-i-center-align-3-radio-buttons">this question</a> and <a href="https://stackoverflow.com/questions/28945581/how-do-i-center-align-3-radio-buttons">this one</a> but have not been able to apply their answers to my situation.  Thanks.</p>