Gibt es eine Möglichkeit, das Material Design (AngularJS) <md-input> Element zu verkleinern?

Question

Ich benutze das <md-input> Tag, aber es hat eine Höhe zu hoch. Gibt es einen Weg, es kleiner zu machen?

Gerade jetzt, was ich habe, ist dies:

<md-content flex class="md-padding" style="font-size:1.2em; max-width:90px; "> 
    <md-input-container> 
    <label>X</label> 
    <input ng-model="motionAbsX"> 
    </md-input-container> 
</md-content> 

So die erste Zeile ist, dass Größe, weil die <md-input>. Es ist 34px x 121px, also möchte ich seine Höhe reduzieren. Ich hat versucht, die maximale Höhe, um es verwenden, aber alles, was ich bekam, war eine Scroll-Leiste:

Ist es möglich, seine Höhe zu ändern oder es wird das Element erben? Das Herunterskalieren ist akzeptabel, aber ich habe keinen Weg gefunden, es zu tun.

Answer 1

Verwenden Zeilenhöhe Eigenschaft. Ändern Sie die Zeilenhöhe wie Sie möchten.

<md-input-container style="line-height:8px"> 
    <label>abc</label> 
    <input ng-model="abc" type="text"/> 
</md-input-container>