我遇到问题在角度材料上的工具栏上定位FAB图标

Question

我无法将角度材质FAB按钮定位到工具栏上。

虽然我的z-index在FAB图标比工具栏上的一个较大。有什么想法吗？

HTML

<div ng-controller="AppCtrl" ng-cloak="" class="toolbardemoBasicUsage" ng-app="MyApp"> 
    <md-content> 
    <md-toolbar class="md-tall md-accent"> 
     <h2 class="md-toolbar-tools"> 
     <span>Toolbar: tall (md-accent)</span> 
     </h2> 
    </md-toolbar> 
    <md-content> 
     <md-button class="md-fab my-fab-element" aria-label="Some content"> 
     + 
    </md-button> 
    </md-content> 
</div> 

CSS

.toolbardemoBasicUsage md-toolbar md-icon.md-default-theme { 
    color: white; 
} 

md-content { 
    position: relative; 
} 

.my-fab-element { 
    right: 0; 
    top: -35px; 
    background: green !important; 
} 

DEMO

http://codepen.io/pennybirman/pen/NbjRNw

Answer 1

FAB超越了md-content，其overflow设置为auto，我想你应该改变它为overflow: visible

CSS：

md-content { 
    position: relative; 
    overflow: visible; 
}