使按钮变窄而不是水平填满整个屏幕

Question

我在这个网页上有这个按钮，看起来很古怪。它在下面;

我使用angularjs V1材料。

我的网页的html代码如下;

<md-card> 
    <md-card-title> 
     <md-card-title-text> 
      <span class="md-headline">Room settings</span> 
     </md-card-title-text> 
    </md-card-title> 
    <md-card-content> 
     <div layout="row" layout-align="space-between center"> 
      <span>Room</span> 
      <md-select ng-model="mode" placeholder="Mode1" class="md-no-underline"> 
       <md-option value="auto">Mode1</md-option> 
       <md-option value="manual">Mode2</md-option> 
      </md-select> 
      <md-select ng-model="channel_number" placeholder="1" class="md-no-underline"> 
       <md-option value="1">1</md-option> 
       <md-option value="2">2</md-option> 
       <md-option value="3">3</md-option> 
      </md-select> 
     </div> 
    </md-card-content> 

    <md-button class="md-raised" ng-click="Process()">Button Press</md-button> 
<md-card> 

我想缩小这个按钮的宽度看起来像一个正常的按钮。我在其他地方使用了类似的代码，如<md-button class="md-raised" ng-click="Process()">Button Press</md-button>，除此网页外，我没有看到这个拉长的按钮。

Answer 1

按钮是填补其容器<md-card>，尝试把它的另一个容器内，在演示的建议是MD-卡操作：

<md-card-actions layout="row" layout-align="end center"> 
    <md-button>Action 1</md-button> 
    <md-button>Action 2</md-button> 
</md-card-actions> 

检查出存储卡中的动作演示： https://material.angularjs.org/latest/demo/card