无法在 AngularJS ui 视图中将 link 居中

Question

我有一个 link 看起来像一个需要水平放置在页面中心的按钮。

这是link：

<a href="#top" target="_self" class="btn btn-info btn-xs">Return to Top</a>

我试过：

style = "margin: 0 auto"
style = "text-align: center"
class="btn btn-info btn-xs center-block"

没有任何效果。是因为我的ui-view是这样设置的吗？

<div class="col-md-10 col-md-offset-1">
    <ui-view></ui-view>
</div>

我该怎么办？

Answer 1

axc, 你好。按照 Imgonzalves 所说的。
你需要给 center 一些东西一些宽度。

看看这个Fiddle.
您将看到按钮居中的顶部块。
使用放置在父级中的 Bootstrap class text-center 然后它将所有文本居中 div 和其中的文本。父级具有宽度，因为它使用 class col-md-10。

此演示中的第二个橙色块显示了您尝试执行的操作。

希望这表明您需要 div 一些宽度以使按钮居中。

Answer 2

您可以将按钮包裹在 div 中，然后将文本中心 class 添加到 div，如下所示：

<div class="text-center">
  <a href="#top" target="_self" class="btn btn-info btn-xs">Return to Top</a>
</div>

Cannot center link in AngularJS ui-view