Skip to content

Scrollable overlays not staying attached when inside tabs #8405

Closed
@alexw10

Description

@alexw10

Bug, feature request, or proposal:

Seems like this a bug unless someone can point me in a direction why what I have doesn't work.

What is the expected behavior?

When applying the cdkScrollable class I would expect the overlay to stay attached to the element

What is the current behavior?

Does not stay attached to the element

What are the steps to reproduce?

Providing a StackBlitz/Plunker (or similar) is the best way to get the team to see your issue.

Plunker starter (using on @master): https://goo.gl/uDmqyY

StackBlitz starter (using latest npm release): https://goo.gl/wwnhMV

Here is a StackBlitz:
https://stackblitz.com/edit/angular-material2-issue-yqzqdh

In the above I am applying the cdkScrollable class but it still does not seem to stay attached properly. Any ideas why? I believe I have it in the right spot which is on the element that is scrolling.
Tried it other places as well but still no luck.

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

Would like to use overlay components inside tabs.

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

Is there anything else we should know?

Metadata

Metadata

Assignees

Labels

P3An issue that is relevant to core functions, but does not impede progress. Important, but not urgentarea: cdk/overlay

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions