按钮相对于内容的位置

Question

我正在使用 Angular Material. 我需要将 FAB 按钮固定在我的内容的底部中心，例如：

这是我尝试过的：

<div>
  <md-button class="md-warn">
    Remove all
  </md-button>
  <md-button class="md-primary" style="float:right">
    Compare
  </md-button>
</div>

</div>
<md-button class="md-fab md-primary" style="position:relative; left:50%; margin-left:-20px; margin-bottom:-27px">
  <md-icon style="color:#fff" class="material-icons">add</md-icon>
</md-button>
</div>

输出：

如您所见，REMOVE 和 COMPARE 按钮与内容边框之间的距离更大，导致包含 FAB 按钮的长度。

如何获得预期的输出？

Answer 1

我认为这里的问题是您需要将所有三个 md-button 元素与 layout-align="space-between center" 放在一行中。希望这是您所期待的： http://codepen.io/anon/pen/dGBjdO

按钮相对于内容的位置

Position button relatively to the content

html

css

angularjs

angular-material