title: Center container in container-fluid
body: <p>I want to center a container inside a container-fluid but I cant get it working</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>/* Setup Buttons Sepcific Styling */
  .setup-bg {
    background: url("https://image.ibb.co/geAGqy/setupbtns_bg.png");
    background-repeat: no-repeat;
    background-position: center;
    height: 550px;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css" rel="stylesheet"/&gt;
  &lt;script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"&gt;&lt;/script&gt;
  
  &lt;div class="container-fluid setup-bg my-auto"&gt;
          &lt;div class="container my-auto"&gt;
              &lt;h3 class="h3 white my-5 text-center justify-content-center"&gt;
                  A simple tool for you to create your own social share bar.
                  &lt;br&gt; Click the social media icons to add them to your bar&lt;/h3&gt;
              &lt;div class="row button-row justify-content-center"&gt;
                  &lt;div class="col-xs-4 col-sm-3 col-md-1"&gt;
                      &lt;label class="image-checkbox"&gt;
                          &lt;a class="htmlShareBtns selectBox" id="html_fs_facebook-btn" width="150"&gt;&lt;/a&gt;
                          &lt;input type="checkbox" name="facebook" value="facebook"&gt;
                      &lt;/label&gt;
                  &lt;/div&gt;
                  &lt;div class="col-xs-4 col-sm-3 col-md-1"&gt;
                      &lt;label class="image-checkbox"&gt;
                          &lt;a class="htmlShareBtns selectBox" id="html_fs_linkedin-btn" width="150"&gt;&lt;/a&gt;
                          &lt;input type="checkbox" name="linkedin" value="linkedin"&gt;
                      &lt;/label&gt;
                  &lt;/div&gt;
                  &lt;div class="col-xs-4 col-sm-3 col-md-1"&gt;
                      &lt;label class="image-checkbox"&gt;
                          &lt;a class="htmlShareBtns selectBox" id="html_fs_twitter-btn" width="150"&gt;&lt;/a&gt;
                          &lt;input type="checkbox" name="twitter" value="twitter"&gt;
                      &lt;/label&gt;
                  &lt;/div&gt;
                  &lt;div class="col-xs-4 col-sm-3 col-md-1"&gt;
                      &lt;label class="image-checkbox"&gt;
                          &lt;a class="htmlShareBtns selectBox" id="html_fs_pocket-btn" width="150"&gt;&lt;/a&gt;
                          &lt;input type="checkbox" name="pocket" value="pocket"&gt;
                      &lt;/label&gt;
                  &lt;/div&gt;
                  &lt;div class="col-xs-4 col-sm-3 col-md-1"&gt;
                      &lt;label class="image-checkbox"&gt;
                          &lt;a class="htmlShareBtns selectBox" id="html_fs_copy-btn" width="150"&gt;&lt;/a&gt;
                          &lt;input type="checkbox" name="copy" value="copy"&gt;
                      &lt;/label&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
              &lt;div class="row text-center my-5"&gt;
                  &lt;div class="col-12"&gt;
                      &lt;button class="btn btn-primary fs_btn-primary" data-toggle="modal" data-target="#exampleModal" onclick="getShareButtonsCode()"&gt;Setup social share buttons&lt;/button&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>Here above the snippet how can I center the text with buttons insite that container-fluid?</p>