The UA stylesheet has a 540px "small devices" media query breakpoint (remove?)

[foolip]

https://html.spec.whatwg.org/multipage/rendering.html#flow-content-3 has this block:

/* for small devices, modal dialogs go full-screen */
@media screen and (max-width: 540px) {
  dialog:modal {
    top: 0;
    width: auto;
    margin: 1em;
  }
}

It seems odd for the spec to have a breakpoint for when this "full-screen" (not in the https://fullscreen.spec.whatwg.org sense) style should apply.

Blink's html.css does not include this rule.

[zcorpan]

@Hixie do you remember why this was added?

[domenic]

This seems intuitive to me... small devices don't have space to be messing around with small dialogs, and just want it to take over the whole screen.

[foolip]

Yes, but can this really be the only default style that's unsuitable for small screens? A breakpoint like this in the UA style sheet looks like an opportunity for surprise, to me at least.

[Hixie]

The other defaults were locked in by legacy. It's the only default I've added since realising how import mobile support is, IIRC.

[foolip]

@tkent-google, when you moved the default style for <dialog> to html.css, do you recall if you deliberately skipped the @media screen and (max-width: 540px) bit under discussion here?

Perhaps I'm the only one who finds this odd? Say an author wants the breakpoint to be either 530px or 550px, it seems a bit tedious to cancel out the default style in this case, more so than for "plain" default style.

[tkent-google]

@foolip I just moved the style, and probably I didn't check the UA style definition in the specification.

[zcorpan]

I think we should remove this, or alternatively make the default style good for small screens and use that style for everything. Having a breakpoint in the UA stylesheet is unexpected. In web-platform-tests/wpt#4605 / #2208 we forgot about this rule both for updating it in the spec and then writing tests in a small iframe assuming the style for "big" screens would apply.