title: Angular 4 mat-tab delete tab
body: <p>How do i delete a dynamic tab in Angular 4? Here is the code that I have tried</p>
  
  <pre><code>&lt;mat-tab *ngFor="let thisTab of tabs" label={{thisTab}} class="close-thik"&gt;
  
  &lt;/mat-tab&gt;
  </code></pre>
  
  <p><strong>CSS</strong></p>
  
  <p>/* Close Button */</p>
  
  <pre><code>[class*='close-'] {
    color: #777;
    font: 14px/100% arial, sans-serif;
    position: absolute;
    right: 5px;
    text-decoration: none;
    text-shadow: 0 1px 0 #fff;
    top: 5px;
  }
  
  .close-classic:after {
    content: 'X'; /* ANSI X letter */
  }
  
  .close-thin:after {
    content: '×'; /* UTF-8 symbol */
  }
  
  .close-thik:after {
    content: '✖'; /* UTF-8 symbol */
  }
  
  /* Dialog */
  
  .dialog {
    background: #ddd;
    border: 1px solid #ccc;
    border-radius: 5px;
    float: left;
    height: 200px;
    margin: 20px;
    position: relative;
    width: 150px;
  
  }
  
  /* Container */
  
  .container {
    width: 576px; margin: 0 auto;
  }
  
  .container:after {
    content: '';
    display: block;
    clear: both;
  }
  </code></pre>
  
  <p>Couldn't achieve the close button on the tab.Is there a standard way to do this via CSS? or Angular itself has some specifications for the same? </p>