paper-tabs don't show correctly on iOS (or Safari?) when parent is flex

[matttk]

Description

If you have paper-tabs inside a container with flex-flow, align-items, and justify-content, the tabs will not work on iOS/Safari.

Expected outcome

Tabs should show and be clickable.

Actual outcome

Only the text of one tab is shown but it doesn't seem to be a tab even, since there is no underline. Clicking it seems to select the whole container, rather than just the tab.

Steps to reproduce

1. Create a paper-tabs with at least two tabs.
2. Set :host (the parent container) to display:flex; flex-flow: column nowrap; align-items: center; justify-content: flex-start;
3. Load the page and note that the tabs do not work.
4. Try deleting flex-flow, align-items, justify-content and reloading; the tabs do work.

Browsers Affected

• Safari iOS

Work Around

Enclose the paper-tabs in a div.