It’s not that Martijn Cuppens used User Agent sniffing, CSS hacks, or anything like that to make this quirk div. This is just a plain ol’ <div>
using the outline
property a la:
div {
outline: inset 100px green;
outline-offset: -125px;
}
It looks different in different browsers because browsers literally render something differently in this strange situation.
I happened upon Reddit user spidermonk33’s comment in which they animated the offset to understand it a bit more. I took that idea and made this little video to show them behaving even weirder than the snapshots…