0

I have a persistent issue with my menu increasing padding on reload, creating an annoying flash on my homepage stefaanoyen.be.

This is a gif of the reload:

Homepage menu flashing

It seems like the padding on the menu increases when the text is loaded. The same effect can be observed with the red button lower on the page (padding increasing to the right) and with the white area this button is in (padding increasing below).

Whatever I try, this issue persists. Can you guys help me out? Thank you so much in advance!

Stefaan
  • 184
  • 4
  • 6
  • 16

1 Answers1

1

I would try to preload font that you are using.

Something like this: https://stackoverflow.com/a/46830425

sasa
  • 399
  • 2
  • 8
  • That did the trick, sasa, thank you! The menu is perfect now, however I still see the white area still expanding a bit. Any suggestions on how to fix that? – Stefaan Dec 31 '21 at 00:04
  • 1
    Happy to hear that! Well, the issue is that the images are not loaded and they take more space than the text. So one solution would be to make them absolute and relative to the white box but be careful with the responsive part, it can become messy. – sasa Dec 31 '21 at 08:50
  • 1
    Thanks for your feedback, sasa! I awarded you the bounty. Happy new year – Stefaan Dec 31 '21 at 18:09
  • Happy to help! Happy new year! :) – sasa Jan 01 '22 at 13:59