堆栈glyphicon上面的文字

Question

这是我的HTML（无法更改）

如何在图片上方堆叠图标？ （它应该居中）

.quicklinks {
  li {
    a {
      font-size: 10px;
      text-transform: uppercase;
      .glyphicon {
        font-size: 26px;
      }
    }
  }
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />

<nav class="quicklinks col-md-offset-8 col-md-4">
  <ul class="list-inline text-right nav navbar-nav">
    <li id="index">
      <a href="/en/index">
        <span class="glyphicon glyphicon-home" title="Home"></span> Home
      </a>
    </li>
    <li id="index">
      <a href="/en/index">
        <span class="glyphicon glyphicon-user" title="User"></span> Home
      </a>
    </li>
  </ul>
</nav>