I'm using md-tabs of angular material but my tabs are getting overlapped. It got fix when I'm visiting each tab at least one's. Below is my code. Angular JS version: 1.4
 <md-content class="md-padding">
<md-tabs md-selected=0>
<md-tab id="tab1" label="one" md-active="true" md-no-select-click="true">
<md-tab-label>Item One</md-tab-label>
<md-tab-body>
View for Item #1 <br/>
data.selectedIndex = 1;
</md-tab-body>
</md-tab>
<md-tab id="tab2" label="two" md-no-select-click="true" md-active="false">
<md-tab-label>Item Two</md-tab-label>
<md-tab-body>
View for Item #2 <br/>
data.selectedIndex = 2;
</md-tab-body>
</md-tab>
<md-tab id="tab3" label="three" md-no-select-click="true" md-active="false">
<md-tab-label>Item three</md-tab-label>
<md-tab-body>
View for Item #3 <br/>
data.selectedIndex = 3;
</md-tab-body>
</md-tab>
<md-tab id="tab4" label="four" md-no-select-click="true" md-active="false">
<md-tab-label>Item three</md-tab-label>
<md-tab-body>
View for Item #3 <br/>
data.selectedIndex = 3;
</md-tab-body>
</md-tab>
<md-tab id="tab5" label="five" md-no-select-click="true" md-active="false">
<md-tab-label>Item three</md-tab-label>
<md-tab-body>
View for Item #3 <br/>
data.selectedIndex = 3;
</md-tab-body>
</md-tab>
</md-tabs>
</md-content>