Material: md-fab-top-right md-bottom-right: Position not fixed with md-content within md-tabs

[dgavigan]

The classes used to fix fabs buttons to the top or bottom becomes broken inside a md-tab containing the md-content directive

http://codepen.io/dgavigan/pen/KpJXNw

[topherfangio]

I think I understand the problem, but I have a quick question: what is your expectation of where the FAB will appear?

Do you expect it to:

1. appear at the bottom right of the content after scrolling it into view
2. or appear outside of the tabs at the bottom right of the screen

[dgavigan]

I expect it to stay in view on the bottom right within each tab.

My example use case is that I have scrolling content on multiple tabs, and trying to use a fab in the lower right for actions specific to current tab. In this case, uploading a photo.

So I guess 2. But I only want it to be visible on a specific tab. Not for every tab.

[topherfangio]

Based on the FAB style recommendations (_check the "For tabbed screens..." paragraph under Behavior_), I would recommend an approach similar to this: http://codepen.io/topherfangio/pen/vObeQb

This way, each FAB is shown/hidden based on what tab is selected, but they aren't inside the tabs. This is important because it means that they won't "slide" with the tab's animation.

[dgavigan]

@topherfangio you da man! thanks for the help. your fab wizardy strikes again.

[topherfangio]

@dg1202 Glad to help! ;-)