angularjsangularjs-materialionic-v1

Ionic md-tabs squeezing tabs

I have created this app with ionic and angular material design. My issue is when I use md-tabs with more than 4 tabs. It's squeezing when I switch between views and back to md-tabs... it's common on android, ios it's just usually. 

<md-tabs md-stretch-tabs="auto" md-align-tabs="top" md-center-tabs="yes"
         md-dynamic-height="" md-border-bottom=""
         md-selected="data.selectedIndex">

Normal

enter image description here

With squeeze

enter image description here

Solution

md-tab-item.md-tab.md-ink-ripple {
    min-width: 111px;
}
Solution

  • Have you tried setting a min-width css property for the generated tab elements?