Skip to content

Dialog changing from position absolute to fixed #225

@craigfrancis

Description

@craigfrancis

Looks like <dialog> is now using position: fixed... as of Chrome 93?

w3c/csswg-drafts#4645
https://www.chromestatus.com/feature/5756963046555648

Not looked into the details yet, but this can cause the window to scroll to the top with showModal(), which is annoying if showing/hiding the dialog, and finding yourself at the top of the page.

Quick fix for now...

  1. CSS dialog to use position: fixed, to match the updated default behaviour.
  2. JS needsCentering() to include && computedStyle.position != 'fixed'
  3. JS reposition() to use element.style.top = ((window.innerHeight - element.offsetHeight) / 2) + 'px';

I suspect that might cause other issues, but that's seems to have fixed my immediate problem.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions