Is there a way to scale down the Material Design (AngularJS) <md-input> element?

Question

I am using the <md-input> tag but it has a height too high. Is there way to make it smaller?

Right now what I have is this:

<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 the first line is that size because the <md-input>. It is 34px x 121px so I want to reduce its height. I tried using the max-height to it but all I got was a scroll bar:

Is it possible to change its height or it is inherit to the element? Scaling down is acceptable but I have't found a way to do it.

Answer 1

Use line height property. Change line-height as u like.

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