md-tabでmd-buttonをフォアグラウンドにできません

md-buttonをmd-tabsエリアに追加しようとしています。開発者ツールを使用すると、ボタンがあることがわかります。これは、しかし見えない：md-tabでmd-buttonをフォアグラウンドにできません

私は非常に高い値とCSSのZインデックスを使用してtghe問題を解決するだろうと考えていた

、それはしませんでした。また

.superclick { 
    right: 0; 
    position: absolute; 
    z-index: 100; 
}

ボタンはクリック可能ではなく、その理由が背景にあるかどうかはわかりません。

私はここで何が欠けていますか？ボタンをどのように前面に持っていくことができますか？

<body> 
<script> 
angular.module('MyApp', ['ngMaterial']) 

.controller('MyCtrl', function ($scope) { 
    $scope.statuses = [ 
     {id: 1, name: "One", description: "First Tooltip"}, 
     {id: 2, name: "Two", description: "Second Tooltip"}, 
     {id: 3, name: "Three", description: "Third Tooltip"}, 
    ]; 

    $scope.addTab = function(){ 
     $scope.statuses.push({id: $scope.statuses.length + 1, name: $scope.statuses.length + 1, description: "New Tooltip"}); 
    } 

    $scope.removeTab = function(status){ 
    alert(status.id); 
    var index = $scope.statuses.indexOf(status); 
    $scope.statuses.splice(index,1); 
    } 

}); 

</script> 

<div ng-app="MyApp"> 
<div ng-controller="MyCtrl"> 
<md-content class="md-padding"> 
    <md-tabs class="" md-selected="selectedTab" md-align-tabs="top" md-border-bottom md-autoselect md-dynamic-height> 

    <md-tab ng-repeat="status in statuses"> 
     <md-tab-label> 
     {{status.name}} 
     <md-tooltip md-direction="bottom"> 
      {{status.description}} 
     </md-tooltip> 
     </md-tab-label> 
     <md-tab-body> 
     <md-button ng-click="removeTab(status)">Remove Tab</md-button> 
     </md-tab-body> 
    </md-tab> 

    <md-button class="superclick">Superclick</md-button> 

    <!--<md-tab ng-click="addTab()"> 
     <md-tab-label> + Add Tab</md-tab-label> 
      <md-tab-body>  
     </md-tab-body> 
    </md-tab>--> 

    </md-tabs> 
</md-content> 
</div> 
</div> 
</body>

出典

2017-02-17 indexoutofbounds

ご意見やご提案はありますか？ – lin

あなた opacity & position（この fiddleを参照）に変更し

：

私fiddleまたは私のコードを参照してください。あなたの要素は隠されており、メインナビゲーションと重なっています。

md-tab-data { 
    opacity:1; 
    z-index: 100; 
    display: inline-block; 
    width:200px; 
    float:right; 
    position:relative; 
}

出典

2017-02-17 11:07:18 lin

md-tabでmd-buttonをフォアグラウンドにできません

答えて

関連する問題