title: Angular Material Tab control - RTL
body: <p>When applying RTL direction to <a href="https://material.angular.io/components/tabs/overview" rel="nofollow noreferrer">Angualr Material Tabs</a> control, <a href="https://stackblitz.com/edit/angular-5tb5pj?file=app/tabs-overview-example.html" rel="nofollow noreferrer">the animation breaks</a> when toggling between tabs.</p>
  
  <pre><code>&lt;div dir="rtl"&gt;
    &lt;mat-tab-group&gt;
      &lt;mat-tab label="Tab 1"&gt;Content 1&lt;/mat-tab&gt;
      &lt;mat-tab label="Tab 2"&gt;Content 2&lt;/mat-tab&gt;
    &lt;/mat-tab-group&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Is there a known fix to this ?</p>
  
  <p><a href="https://stackblitz.com/edit/angular-5tb5pj?file=app/tabs-overview-example.html" rel="nofollow noreferrer">reproduce demo</a></p>