How to style md-tab?

How do I style the md-tab?

I’ve created a few test tabs using the documentation. But I can’t figure out how to make the tab’s width to be smaller. The default width is too large for mobile screens.

<md-tab-group selectedIndex=0>
  <md-tab style="width:50px">
    <template md-tab-label>Tab1</template>
      <h1>Some more tab content</h1>
      <p>...</p>
    <template md-tab-content>
    </template>
  </md-tab>
  <md-tab>
    <template md-tab-label>Tab2</template>
    <template md-tab-content>
      <h1>Some more tab content</h1>
      <p>...</p>
    </template>
  </md-tab>
</md-tab-group>

[RedFour]

@hstevensagain thx! the css code you gave worked!

/deep/ .md-tab-label {
  min-width: 1px !important;
}

[hstevensagain]

@jelbourn, @RedFour seems to specifically be talking about this, which doesn’t look slated for theming at the moment. Dynamic changes to the width of the tabs probably aren’t in the scope of app wide theming either.

Imo md-tab-labels shouldn’t have a min-width. They should expand and contract to the width of the md-tab-group, keeping the tabs responsive after that is the developer’s job.

I get that there is a lot more work to be done on md-tabs, for the mean time changing the min-width: 160px; to width: 100%; would make md-tabs a lot more usable and responsive.