Angular Materiallayout - Probleme mit Flex

Question

Ich habe ein Problem beim Festlegen der Flex-Eigenschaften meines Layouts. Hier ist ein 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> 

Hier ist der Link zur Dokumentation: https://material.angularjs.org/#/layout/grid

Das Problem, dass die Flex-Eigenschaft des Eingangs (Text) und Eingang (Taste) nicht das Flex-Attribut zu gehorchen .

Was ich versuche zu erreichen ist so etwas wie das:

Answer 1

hier ist das Ergebnis, nachdem ich es versucht,

hoffentlich hilft es:

<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>