Does this issue occur when all extensions are disabled?: Yes/No
Yes
- VS Code Version: 1.60.1
- OS Version: web
The issue occurs when trying to intergrate VSCode (or Monaco) into a transform parent element.
Steps to Reproduce:
|
body.web { |
|
position: fixed; /* prevent bounce effect */ |
|
} |
Replace the body.web {} with:
body.web {
position: absolute;
left: 0;
top: 0;
will-change: transform;
transform: translate(100px, 100px);
}
- Run
yarn watch and yarn web.
- Right click the editor and move the mouse to a context menu item with submenu.
- The submenu is in incorrect position.

Reason:
This is because transform ancestor behaves as the containing block of fixed descendants.
Here is the code that causes the issue:
|
this.submenuContainer.style.left = `${left}px`; |
|
this.submenuContainer.style.top = `${top}px`; |
A PR has been made for this issue.
Does this issue occur when all extensions are disabled?: Yes/No
Yes
The issue occurs when trying to intergrate VSCode (or Monaco) into a
transformparent element.Steps to Reproduce:
vscode/src/vs/workbench/browser/media/style.css
Lines 44 to 46 in 33c149f
Replace the
body.web {}with:yarn watchandyarn web.Reason:
This is because
transformancestor behaves as the containing block of fixed descendants.Here is the code that causes the issue:
vscode/src/vs/base/browser/ui/menu/menu.ts
Lines 920 to 921 in 83bd43b
A PR has been made for this issue.