bootstrapのモーダルの縦位置を調整する

twitter bootstrapのモーダルウィンドウの縦位置の調整の仕方。

以下のようにcssに新しいクラスを宣言して、お目当てのモーダルに付けてあげるとtop位置が調整できるます。

/* css */
.modal-dialog-center {
  padding-top: 40%;
}

/* html */
<div class="modal fade" tabindex="-1">
  <div class="modal-dialog modal-sm modal-dialog-center">
    <div class="modal-content">
      <div class="modal-body">
        <p>テスト！</p>
      </div>
    </div>
  </div>
</div> <!-- modal  -->