Tab pagination: strange behaviour when resizing the browser window

[RaulRG]

Bug, feature request, or proposal:

When resizing the browser window the tab pagination does not behave as expected

What is the expected behavior?

There are some different problems (don't know if you would prefer one issue per problem)

What is the current behavior?

1. The different tabs resize themselves, but the colored line to indicate the focused tab keeps the "old" size.
2. When the window is resized to be smaller I get the arrows to allow me to scroll the tabs, but when I resize the window again they stay there even if there is enough space for all tabs.
3. If you scroll the tabs using the arrows some of them go out of sight (expected), but if I resize the window they are kept out of sight even if there is enough space for them.
4. Sometimes the arrows aren't shown when resizing. When this happens I can resize as much as I want, they are never shown. I don't know how to reproduce it. It happens when using the component.

What are the steps to reproduce?

Use the plunker and resize the viewport using the splitter. You should be able to reproduce all the problems,

Plunker : http://plnkr.co/edit/gAeoyntvHPo3j7SomTMy

What is the use-case or motivation for changing an existing behavior?

Which versions of Angular, Material, OS, browsers are affected?

Angular 2.3.1, Material 2.0 beta 1, Windows 10 with Chrome 55.0.2883.87 m

Is there anything else we should know?

[RaulRG]

This is very disturbing. Arrows are not shown correctly, tabs and their lines for indicating they are selected are not the same size. You must click on the tabs for them to display correctly. Tested with the current beta 2. The problems are still there.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}