title: Remove padding from mat-list-item
body: <p>The <code>mat-list</code> component in angular/material2 applies a top and bottom padding of 16px. I'd like to make this 0px. I've tried applying a style with a higher specificity but it isn't working (or I'm doing it wrong).The style I'm trying to override is:</p>
  
  <p><a href="https://i.stack.imgur.com/vdOHA.jpg" rel="noreferrer"><img src="https://i.stack.imgur.com/vdOHA.jpg" alt="mat-list-item-content style applying 16px padding"></a></p>
  
  <p>I'm trying to override this with:</p>
  
  <pre><code>.list .mat-list .mat-list-item .mat-multi-line .mat-list-item-content {
    padding-top: 0;
    padding-bottom: 0;
  }
  </code></pre>
  
  <pre class="lang-html prettyprint-override"><code>&lt;div class="list"&gt;
    &lt;mat-list&gt;
      &lt;mat-list-item *ngFor="let item of queue"&gt;
        &lt;h1 matLine&gt;{{ item.id }}: {{ item.status}} {{ item.statusDate }}&lt;/h1&gt;
        &lt;p matLine&gt;{{ item.name }}&lt;/p&gt;
        &lt;p matLine&gt;for {{ item.customer }}&lt;/p&gt;
        &lt;div matLine&gt;
          &lt;button mat-icon-button (click)="openTab(item)"&gt;
            &lt;mat-icon fontIcon="icon-open"&gt;&lt;/mat-icon&gt;
          &lt;/button&gt;
          &lt;button *ngIf="showAssignToMe" mat-icon-button (click)="assignToMe(item)"&gt;
            &lt;mat-icon fontIcon="icon-assign_to_me"&gt;&lt;/mat-icon&gt;
          &lt;/button&gt;
          &lt;button mat-icon-button (click)="notes(item)"&gt;
            &lt;mat-icon fontIcon="icon-comment"&gt;&lt;/mat-icon&gt;
          &lt;/button&gt;
        &lt;/div&gt;
      &lt;/mat-list-item&gt;
    &lt;/mat-list&gt;
  &lt;/div&gt;
  </code></pre>