Изменение размеров объектов для Twitter Bootstrap

Question

Я хочу поставить коробки для входа в центр. Не знаю, как это сделать в бутстрапе. может ли кто-нибудь сказать, что это нужно сделать.

Ниже приведен код, который я написал. Пожалуйста, исправьте меня

<div class="container-fluid"> 

    <div class="starter-template"> 
    <h1>Bootstrap starter template</h1> 
    <p class="lead">Use this document as a way to quickly start any new project.<br> All you get is this text and a mostly barebones HTML document.</p> 
     <button type="button" class="btn btn-primary btn-lg">Register</button> 
     <h3><strong>OR</strong></h3> 
    </div> 
<div class="col-sm-6"> 
    <form class="form-signin" style="text-align:center" role="form"> 
     <h2 class="form-signin-heading">Please sign in to Continue</h2>   
     <div class="col-lg-7"><input type="email" class="form-control text-center" placeholder="Domain ID" autofocus required></div> 
     <div class="col-lg-7"><input type="password" class="form-control text-center" placeholder="Password" required></div> 
     <p><button class="btn btn-lg btn-primary" type="submit">Sign in</button> 
    </form> 
    </div> 
</div> 

Answer 1

Если вам нужно только центрировать Login Div, просто следуйте стандарту базовой сетки бутстрапов. Сетка разделена на 12 столбцов. Чтобы центрировать div, который охватывает 6 столбцов, вам нужно, чтобы это было 3 столбца от начала, очень слева от страницы. т.е. Col-см-офсет-3 Я изменил код, чтобы отразить изменения

<div class="container-fluid"> 
<div class="starter-template text-center"> 
    <h1>Bootstrap starter template</h1> 
    <p class="lead">Use this document as a way to quickly start any new project. 
     <br>All you get is this text and a mostly barebones HTML document.</p> 
    <button type="button" class="btn btn-primary btn-lg">Register</button> 
    <h3> 
     <strong>OR</strong> 
    </h3> 
</div> 
<div class="col-sm-offset-3 col-sm-6"> 
    <form class="form-signin text-center" role="form"> 
     <h2 class="form-signin-heading">Please sign in to Continue</h2> 
     <input type="email" class="form-control text-center" placeholder="Domain ID" autofocus required> 
     <input type="password" class="form-control text-center" placeholder="Password" required> 
     <br> 
     <button class="btn btn-md btn-primary" type="submit">Sign in</button> 
    </form> 
    </div> 
</div> 

рабочий код: jsBin : Centered Login Div