Fix layout shifts caused by early rendering passes
authorAlexander Ebert <ebert@woltlab.com>
Mon, 21 Aug 2023 12:17:55 +0000 (14:17 +0200)
committerAlexander Ebert <ebert@woltlab.com>
Mon, 21 Aug 2023 12:17:55 +0000 (14:17 +0200)
commit81c15c9c6ce20f8ba7e06bfe61477c2ec24ca084
treed97142285887c7c313728ce5c9d3a19350e80b5e
parent10500cc52a9f94b670add6d2b765e5187906aa1b
Fix layout shifts caused by early rendering passes

The previous CSS code relied on `.content:not(:last-child)` to reserve the space required for the right sidebar.

This selector does not work as expected when the browser does an early rendering pass while the `.content` block is still open. It causes the space for the sidebar to be reserved but once the parsing continues the browser realizes that there is no sidebar (=`.content` is the last child) and layout is visually updated.

See https://www.woltlab.com/community/thread/301233-template-list-behavior-when-sorting-results/
com.woltlab.wcf/templates/footer.tpl
com.woltlab.wcf/templates/header.tpl
wcfsetup/install/files/style/layout/layout.scss