Css position: fixed not work


The Description of problem

Maybe you should reconsider RadzenLayout ,
because we lose the ability to create our own fullscreen elements, windows,,,
as full screen picture viewer or own modal windows?

How I can create fullscreen picture viewer?


You can check how our dialog works for reference.

Try the following:

  1. Set the style of your RadzenBody like this <RadzenBody style="transform: none">
  2. Set the z-index of your fixed element to 2 or more <div style="position: fixed; top: 0; left: 0; z-index: 2;width: 100%; height: 100%"></div>

Then it should work as expected:

The cause of the issue is that RadzenBody has transform: translateZ(0) which for some reason acts as position: absolute. As a result all fixed children of RadzenBody are positioned according RadzenBody itself and not the browser viewport. We needed this translateZ(0) as a fix for some animation flickering. Setting style="transform: none" overrides translateZ and restores the stacking order.