Bootstrap получает div для выравнивания по центру

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

<div class="footer">
  <div class="container">   
    <div class="navbar-text pull-left">
      <p> Hello there </p>
    </div>
        <div class="Button" align="center">  
            <a href="#" class="btn btn-warning" onclick="changeLook()">Re</a>
            <a href="#" class="btn btn-warning" onclick="changeBack()">Rs</a>
        </div>
    <div class="navbar-text pull-right">
      <a href="#"><i class="fa fa-facebook-square fa-2x"></i></a>
      <a href="#"><i class="fa fa-twitter fa-2x"></i></a>
      <a href="#"><i class="fa fa-google-plus fa-2x"></i></a>
    </div>
  </div>
</div>

Я не уверен, что мне нужно использовать CSS, чтобы заставить его идти посередине, или если мне нужно просто использовать выравнивание, но ничего не работает

Ответ 1

В начальной загрузке вы можете использовать .text-center для выравнивания центра. также добавьте .row и .col-md-* в свой код.

align= устарела,

Добавлен .col-xs-* для демонстрации

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css" rel="stylesheet" />
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />
<div class="footer">
  <div class="container">
    <div class="row">
      <div class="col-xs-4">
        <p>Hello there</p>
      </div>
      <div class="col-xs-4 text-center">
        <a href="#" class="btn btn-warning" onclick="changeLook()">Re</a>
        <a href="#" class="btn btn-warning" onclick="changeBack()">Rs</a>
      </div>
      <div class="col-xs-4 text-right">
        <a href="#"><i class="fa fa-facebook-square fa-2x"></i></a>
        <a href="#"><i class="fa fa-twitter fa-2x"></i></a>
        <a href="#"><i class="fa fa-google-plus fa-2x"></i></a>
      </div>
    </div>
  </div>
</div>

Ответ 2

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

<div class="text-center">Centered content goes here</div>