角度材料佈局 - 與flex的問題

Question

我有一個問題，設置我的佈局的flex屬性。這裏是一個plunker： http://embed.plnkr.co/0SrUp25FvT2PAsJDEwF3/preview

<md-content flex layout="row" layout-align="center"> 
    <div layout="column"> 
     <div flex layout="column" layout-fill> 
     <div flex="33"> 
      <md-input-container> 
      <label>Enter Room's Name</label> 
      <input ng-model="test" placeholder="Enter Room's Name"> 
      </md-input-container> 
     </div> 
     <div flex="66"> 
      <md-button class="md-raised md-accent"> 
      Create Chat Room 
      </md-button> 
     </div> 
     </div> 
    </div> 
    </md-content> 

這裏是鏈接到文件： https://material.angularjs.org/#/layout/grid

，輸入（文本），並輸入（按鈕）的柔性性質不服從flex屬性問題。

我所試圖實現的是類似的東西：

Answer 1

這裏是結果我試了之後，

希望這有助於：

<md-content layout="row" layout-align="center"> 
    <div layout="column"> 
    <div flex layout="column" layout-fill> <!-- this is what I change --> 
     <div flex="33"> 
     <md-input-container> 
      <label>Enter Room's Name</label> 
      <input ng-model="test" placeholder="Enter Room's Name"> 
     </md-input-container> 
     </div> 
     <div flex="66"> 
     <md-button class="md-raised md-accent"> 
      Create Chat Room 
     </md-button> 
     </div> 
    </div> 
    </div> 

</md-content>