title: How to change position of Angular Material placeholder in angular8?
body: <p>I have <code>angular8</code> project in which i have <code>angular material</code>. I am using <code>mat-autocomplete</code> for input autocomplete. Here is the code of my html </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;form class="example-form"&gt;
    &lt;mat-form-field class="example-full-width dummy-input-field" floatLabel="never"&gt;
      &lt;input matInput class="custom-input" placeholder="State"  [matAutocomplete]="auto" [formControl]="stateCtrl"&gt;
    &lt;/mat-form-field&gt;
    &lt;mat-autocomplete #auto="matAutocomplete"&gt;
        &lt;mat-option *ngFor="let state of filteredStates | async" [value]="state.name"&gt;
          &lt;img class="example-option-img" aria-hidden [src]="state.flag" height="25"&gt;
          &lt;span&gt;{{state.name}}&lt;/span&gt; |
          &lt;small&gt;Population: {{state.population}}&lt;/small&gt;
        &lt;/mat-option&gt;
      &lt;/mat-autocomplete&gt;
  &lt;/form&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>Here is my complete <a href="https://stackblitz.com/edit/angular-hwkutg" rel="nofollow noreferrer">Stackblitz Link</a> to demonstrate my issue. There is a placeholder inside input that says 'State'. I want to position this <code>placeholder</code> in the vertical middle of input like normal input boxes of <code>Html</code>.</p>
  
  <p>How can i change the position of <code>angular material</code> input placeholder's position ?</p>