demo · v131

quirks vs no-quirks PiP mode probe

Before v131, the empty DocPiP document was always quirks-mode. CSS box-sizing, table cell layouts, line-height all behaved subtly different. v131 inherits the opener's compat mode so the PiP body and the host body render identically. This page opens a PiP and reports the resolved compatMode + computed sizes side-by-side.

host document

compatMode
box-sizing default
line-height resolved

A test box, 200×60 content size + 12px padding + 2px border:

200×60 content
rendered width

PiP document

compatMode—
box-sizing default—
line-height resolved—

Open the PiP window to populate. The same 200×60 + 12px padding + 2px border applies inside.

rendered width—

the api

const win = await documentPictureInPicture.requestWindow({
  width: 320, height: 200,
  // v131: this copies opener's document mode + sheets
});
// win.document.compatMode now matches opener
console.log(win.document.compatMode);  // "CSS1Compat" (no-quirks)

see also