List of steps to reproduce (step by step, including full links if applicable):

• Navigate to a page on prod with coordinates while logged in and using modern Vector
  • i.e. https://en.wikipedia.org/wiki/Madrid or https://en.wikipedia.org/wiki/Lisbon
• Note: this is not an issue for:
  • anonymous users
  • legacy Vector
  • pages with less text in the hatnote div i.e. https://en.wikipedia.org/wiki/Paris

What happens?:

The top-level div (div.hatnote) runs into coordinates

What should have happened instead?:

Look less janky

Software version (if not a Wikimedia wiki), browser information, screenshots, other information, etc:

https://en.wikipedia.org/wiki/Madrid

https://en.wikipedia.org/wiki/Lisbon