Es ist nicht so, dass Martijn Cuppens User-Agent-Sniffing, CSS-Hacks oder ähnliches verwendet hat, um dieses seltsame Div zu erstellen. Dies ist nur ein ganz normales <div>, das die outline-Eigenschaft verwendet, wie z. B.
div {
outline: inset 100px green;
outline-offset: -125px;
}Es sieht in verschiedenen Browsern unterschiedlich aus, weil Browser etwas in dieser seltsamen Situation buchstäblich unterschiedlich rendern.
Ich bin auf den Kommentar des Reddit-Users spidermonk33 gestoßen, in dem er den Offset animiert hat, um ihn besser zu verstehen. Ich habe diese Idee aufgegriffen und dieses kleine Video erstellt, um zu zeigen, wie sie sich noch seltsamer verhalten als auf den Schnappschüssen...