Reply To: Flickering Navigation Back

[Tom]

The arrows for the dropdown menu are actually using CSS borders to create a triangle effect – no icon fonts or images.

You can inspect the element of the search icon to see it’s just using a regular Font Awesome icon: <i class="fa fa-search"></i>

Chrome is known for delaying before showing icon fonts – it was touched on here: https://css-tricks.com/forums/topic/icon-fonts-pause-before-rendering/

Alternatively, you could create an image, and then add it to your menu item, and give that menu item the class of “search-item custom”.

Then add this CSS:

.search-item {
    display: none;
}

.search-item.custom {
    display: block;
}

Personally I’ll take that extra split second of load time in Chrome over having to load an image, but it’s all preference 🙂