block-scroll-strategy: some styles will cause not working as expected

[hsuanxyz]

What is the expected behavior?

documentElement fixed the position and block scrolling.

What is the current behavior?

documentElement the position offset.

What are the steps to reproduce?

html, body {
  width: 100%;
  height: 100%;
}

body { 
  overflow-x: hidden;
}

StackBlitz: https://stackblitz.com/edit/angular-cgmaeh

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

@angular/cdk 7.3

Is there anything else we should know?

https://github.com/angular/material2/blob/e039d6388fd18726c18ba1252b2118b8dfe87dfb/src/cdk/overlay/_overlay.scss#L128~L140

  .cdk-global-scrollblock {
  ...
+  body {
+    overflow-x: unset;
+  }
  }

[wzhudev]

overflow-x: visible may be better.

[devversion]

Seems like this is still an issue. Here is an updated reproduction: https://stackblitz.com/edit/angular-cgmaeh?file=app%2Fdialog-overview-example.html

It looks like the app misses margin: 0 for body and html. The scrolling appears due to the body element being shifted down. It seems to be shifted down due to the first <p> element margin.