Original report: https://en.wikivoyage.org/wiki/Wikivoyage:Travellers%27_pub#Shrunk_banners
**Steps to replicate the issue** (include links if applicable):
* https://en.wikivoyage.org/wiki/France
**What happens?**:
Bug 1, for all users: There is a lot of space before the banner.
Bug 2, for all users: The items in de ToC are pretty small and hard to read
Bug 3, for Safari users. The banner seems to be only 20% of the required height
All of this has to do with modifications that desktop improvements has made.
**Causes**
Bug 1: The `vector-body-before-content` is a ~~display:block~~ uses `overflow:hidden`, to create a new block formatting context, which negates the floate of the mw-indicators, which normally would take up 0 height and thus pushes the banner down.
Bug 2: The font-size of contentSub is overridden from 100% to 84% by specificity increase due to zebra-feature wrapping.
Bug 3: The font-size change somehow seems to trigger a subpixel sizing bug in Safari. The width of the image is set to 100% and height to auto, yet with the font size change, it seems that when the responsive sizing applies, it incorrectly pixel rounds the image dimensions. A height of say 126 pixels, becomes 126.24px when that font-size option is set. This causes the image to be larger than its container (this should not be possible, it's clearly a safari bug). Because the image is bigger than the container, it then [[ https://github.com/wikimedia/mediawiki-extensions-WikidataPageBanner/blob/2dc890f02ec2b66311717029569a55cc78da6e30/resources/ext.WikidataPageBanner.positionBanner/ext.WikidataPageBanner.positionBanner.js#L80 | triggers portrait detection ]], which in turn sets a margin-top, that causes half the picture to become way to small vertically.
**Screenshots**
Original Vector:
{F36989840}
Vector 2022 Chrome:
{F36989842}
Vector 2022 Safari:
{F36989844}