bug(mat-tab-group): inner div cannot cover 100% of viewport, on iphone

#### Reproduction

Use StackBlitz to reproduce your issue: https://stackblitz.com/fork/components-issue
StackBlitz to reproduce:
https://stackblitz.com/edit/components-issue-dssxxk
or
https://stackblitz.com/edit/angular-3qr9lv

Attention - this will reproduce only on iOS (e.g. iPhone) with both Chrome and Safari.
On Android it works perfectly.
On computer with Chrome and F12 on - it works perfectly.

Steps to reproduce:
1. Create mat-tab-group with few mat-tab children.
2. Inside one of the children, set a div with 100% height, 100% width, fixed position, with top, right equal to zero and a high z-index. Also, set it with a background-color (e.g. blue) to easily reproduce the behavior.


#### Expected Behavior

What behavior were you expecting to see?
The created div should cover ALL viewport (top to bottom, right to left), including the mat-tab, mat-tab-group and any other components on the HTML page (e.g. navbar etc.)
In other words - all screen will be blue.

#### Actual Behavior

What behavior did you actually see?
The created div covers the entire page, but you cannot see it, although it has a blue background, the blue color appears only within the mat-tab. above the mat-tab it doesn't show the blue background, yet it covers the elements (e.g. if you have a button above the mat-tab-group, you cannot click it)

#### Environment

- Angular: 8
- CDK/Material: 8
- Browser(s): chrome, safari
- Operating System (e.g. Windows, macOS, Ubuntu): iOS

Start with the linked StackBlitz reproductions and run them on iOS in both Chrome and Safari, then compare the mat-tab-group behavior with Android or desktop. Trace the mat-tab-group layout and positioning involved in the viewport-covering inner div. Done means the div visibly covers the full viewport, including content outside the tab group, without changing the stated behavior on other platforms.

Written by the indexing model from the issue text.