Как центрировать ящик на Twitter Bootstrap

Я выкладываю экран входа в систему, и на этом экране будет только поле с LOGIN и PASSWORD. Мне нужно централизовать вертикально и горизонтально (например, любой традиционный экран входа в систему).

Как я могу достичь этого с помощью Bootstrap Twitter?

Ответы

Ответ 1

Если вы используете загрузочную сетку, вы можете компенсировать свои столбцы:

<div class="row">
  <div class="span6 offset3">
     Your content goes here
  </div>
</div>

См. пример здесь: http://twitter.github.com/bootstrap/scaffolding.html#gridSystem

Или вы можете просто использовать CSS для простого элемента центрального блока,

div.login-box{
  margin:0 auto;
  width: 720px;
}

Ответ 2

ОБНОВЛЕНИЕ Джонни отвечает: для Bootstrap 3; синтаксис немного отличается:

<div class="row">
    <div class="col-sm-6 col-sm-offset-3">
        Your content goes here
    </div>
</div>

или: еще лучше:

<div class="container">
    <div class="row">
        <div class="col-sm-6 col-sm-offset-3">
            Your content goes here
        </div>
    </div>
</div>