AngularJS - md-menu-barのright md-buttonを整えよう

Question

私はAngularを初めて使っています。私はこれを研究しましたが、まだ解決できません。

私のVTS Anketaボタンはである必要がありますが、その他のボタンはすべて左に揃えています。ここで

コードです：

<md-toolbar layout="row" flex="1"> 
    <md-menu-bar> 
    <md-menu> 
     <md-button ng-href="/#/">Home</md-button> 
    </md-menu> 
    <md-menu> 
     <md-button ng-href="/#/create">Napravi anketu</md-button> 
    </md-menu> 
    <md-menu> 
     <md-button ng-href="/#/view">Pogledaj anketu</md-button> 
    </md-menu> 
    <md-menu> 
     <md-button layout-align="right" ng-href="/#/delete" ng-click="delete()"> Izbrisi anketu</md-button> 
    </md-menu> 
    <md-menu> 
     <md-button id="moveright" ng-href="/#/">VTŠ Anketa</md-button> 
    </md-menu> 
    </md-menu-bar> 
</md-toolbar> 

は、私はMD-ボタンとMD-メニューの前にスパンフレックスを追加しようとしましたが、その後ボタンがちょうど。消える：

を

<md-menu> 
    <span flex></span> 
    <md-button id="moveright" ng-href="/#/">VTŠ Anketa</md-button> 
</md-menu> 

結果：

また、タグにidを追加してから、そのidをcssで呼び出してtext-align：rightという名前を使用してみましたが、これも何もしませんでした。

Answer 1

私は別のツールバーを作成し、次のようにスパンレイアウトを使用：

<md-toolbar layout="column"> 

    <span layout="row" layout-padding> 
    <h2 class="md-toolbar-tools" style="font-family: Trebuchet MS;"> VTŠ Anketa</h2> 

    <md-button ng-href="/#/" id="movebottom">Glasaj</md-button> 
    <md-button ng-href="/#/create">Napravi</md-button> 
    <md-button ng-href="/#/view">Pogledaj</md-button> 
    <md-button ng-href="/#/delete" ng-click="delete()"> Izbriši</md-button> 
    </span> 
</md-toolbar> 

Answer 2

はMD-メニューバーにフレックス追加し、フロートを追加します。右のid moverightへ

<md-menu-bar flex> 
    <md-menu> 
     <md-button ng-href="/#/">Home</md-button> 
    </md-menu> 
    <md-menu> 
     <md-button ng-href="/#/create">Napravi anketu</md-button> 
    </md-menu> 
    <md-menu> 
     <md-button ng-href="/#/view">Pogledaj anketu</md-button> 
    </md-menu> 
    <md-menu> 
     <md-button ng-href="/#/delete" ng-click="delete()"> Izbrisi anketu</md-button> 
    </md-menu> 
    <md-menu > 
     <md-button id="moveright" ng-href="/#/">VTŠ Anketa</md-button> 
    </md-menu> 
    </md-menu-bar> 

CSS ：

#moveright { 
    float: right; 
} 

これは、ツールバーにmd-menu-barの最大幅があるためです。アイテムの周りを移動することができます。 right`：https://codepen.io/anon/pen/WjxwNZ