bootstrap div не центр

Question

Я делаю сайт начальной загрузки с центральным ящиком, но весь мой контейнер не центрируется, они остаются слева от страницы, я не знаю почему. Я просто пробовал со смещением, но не работает.

my pen on codepen

<div class="container-fluid"> 
 
    
 
<div class="container"> 
 
    <div class="row"> 
 
    <div class="col-md-12"> 
 
     <h1 class="text-center"><span class="title">title</span> 
 
     <i class="fa fa-twitch fa-2x" aria-hidden="true"></i> 
 
     <span class="subt">subtitle</span></h1> 
 
     </div> 
 
     
 
    </div> 
 
     
 
    </div> <!--close h1 container--> 
 
    
 
    <div class="container box"> 
 
    <div class="row"> 
 
     <div class="col-md-6 col-md-offset-3"> 
 
<div class="container status"> 
 
    <div class="row"> 
 
     <div class="col-md-6 col-md-offset-3 col"> 
 
     
 
     <div class="btn-group btn-group-justified" role="group" aria-label="..."> 
 
    <button type="button" class="btn btn-success">Online</button> 
 
    <button type="button" class="btn btn-warning">Offline</button> 
 
    <button type="button" class="btn btn-default">All</button> 
 
</div> <!--btn group--> 
 
    
 
     
 
     
 
    </div> 
 
    </div> 
 
    </div><!--close container status--> 
 
    
 
     </div> 
 
     </div> 
 
    </div><!--container box--> 
 
    
 
     </div><!--close container fluid-->

Answer 1

Bootstrap 4 использует немного другой синтаксис для смещения.

col-md-offset-3 становится offset-md-3

Updated CodePen

Answer 2

Контейнеры не являются гнезда в состоянии. Вместо этого используйте контейнеры.

Используйте синтаксис Bootstrap 4 для смещений, если вы загружаете Bootstrap 4 CSS. Или загрузите Boostrap 3 CSS.

offset-md-3

Boostrap 3 и 4 Bootstrap Docs http://getbootstrap.com https://v4-alpha.getbootstrap.com