Streaming live at 10am (PST)

Topbar items shift on load?


#1

Whenever I load up my website I experience a repositioning/shifting of my top bar items before they snap back into place. How do I prevent this?

Here's my site: http://ecomio.webflow.io/
Here's my preview link: https://preview.webflow.com/preview/ecomio?preview=9562faad4f23506f00bdee67d6910e7b

Best,
Christopher


#2

Select the .Navigation-items element, cancel its float property and give it Display:inline-box.

It flashes because somehow the nav item element displays first, and as it has a float it gets printed to the left, before the browser fully applies the css with all loaded elements. You could also give a width value to the .logo-home element. The glitch happens because HTML doesn't know the size of this element until the image is loaded. By giving a size to the image container, or a size to the image itself in CSS, even if the images loads after the menu, the menu will be placed where it should.


#3

This topic was automatically closed after 60 days. New replies are no longer allowed.