Как выравнивать столбцы в центре страницы?

Question

Как выровнять столбцы так, чтобы они шли в центре страницы? Столбцы выравнивания влево, но мне нужно, чтобы они были сосредоточены в центре страницы Im использованием CSS3, HTML5 и самозагрузки v3.3.4

<section id="about-us" class="about-us"> 
    <div class="container-fluid"> 
     <div class="row"> 
      <div class="col-md-3 col-sm-3"> 
       <div class="block wow fadeInRight" data-wow-delay=".3s" data-wow-duration="900ms"> 
        <h2>one</h2> 
       </div> 
      </div> 
      <div class="row"> 
       <div class="col-md-3 col-sm-3"> 
        <div class="block wow fadeInRight" data-wow-delay=".6s" data-wow-duration="900ms"> 
         <h1>One</h1> 
         <h1>Two</h1> 
         <h1>Three</h1> 
         <h1>Four</h1> 
         <h1>Five</h1> 
         <h1>Six</h1> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 
</section> 

CSS

.about-us { 
    background-image:linear-gradient(rgba(18, 172, 234, 0.42),  rgba(0, 191, 255, 0.55)),url(background-about-header.png); 
    background-size: cover; 
    background-attachment: scroll; 
    color: #fff; 
    position: relative; 
    background-position: center; 
    overflow: hidden; 
    height: 100vh; 
} 

#about-us h1 { 
    font-size: 400%; 
    font-weight: 400; 
    text-transform: none; 
    color: #666; 
    text-align: justify; 
    margin: auto; 
} 


.about-us h2 { 
    font-size: 750%; 
    font-weight: 400; 
    text-transform: uppercase; 
    color: #666; 
    line-height: 80px; 
    padding-top: 120px; 
    margin: auto; 
} 

#about-us .block { 
    position: relative; 
    padding: 310px 0px 0px; 
    text-align: center; 
    margin: auto; 
} 

Answer 1

Вы хотите использовать Twitter Bootstraps .col-md-offset-* классы. Here - это документация. Вы хотите, чтобы добавить смещение в крайней левой колонке, которая будет двигаться, что DIV над количеством столбцов, определяющих, так, например, ваш HTML будет выглядеть следующим образом:

<section id="about-us" class="about-us"> 
    <div class="container-fluid"> 
     <div class="row"> 
      <div class="col-md-3 col-md-offset-3 col-sm-3 col-sm-offset-3"> //see here we added the two offset classes 
       <div class="block wow fadeInRight" data-wow-delay=".3s" data-wow-duration="900ms"> 
        <h2>one</h2> 
       </div> 
      </div> 
      <div class="row"> 
       <div class="col-md-3 col-sm-3"> 
        <div class="block wow fadeInRight" data-wow-delay=".6s" data-wow-duration="900ms"> 
         <h1>One</h1> 
         <h1>Two</h1> 
         <h1>Three</h1> 
         <h1>Four</h1> 
         <h1>Five</h1> 
         <h1>Six</h1> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 
</section>