title: How to use mat-grid or grid list inside mat-option instead of using css display grid
body: <p>I have name and id both displayed in two different lines in mat-option, I am using <code>display:grid</code> in mat-option-list css , instead i wanted to use mat-grid or grid-list properties to display them as in grid.   </p>
  
  <pre><code>&lt;input matInput class="form-control input" [(ngModel)]="userTextvalue"matAutocomplete]="auto"&gt;
    &lt;mat-autocomplete class="user-autocomplete" #auto="matAutocomplete"&gt;
      &lt;mat-option-list *ngFor="let user of filteredUsers" [value]="user.name"&gt;
          &lt;span class="username"&gt;{{user.name}}&lt;/span&gt;
          &lt;span class="usercode"&gt;{{user.code}}&lt;/span&gt;
        &lt;/mat-option&gt;
    &lt;/mat-autocomplete&gt;
  </code></pre>
  
  <p>scss:</p>
  
  <pre><code>.mat-option-text {
    line-height: normal;
    display: grid;
  }
  </code></pre>
  
  <p>[<img src="https://i.stack.imgur.com/hcD5E.png" alt="current behaviour[1]"></p>