Archived topic
Menu and Font Awesome Icons
6 replies · Started by Richard on November 14, 2020
Hello, today I noticed that the menu items I added with Font Awesome Icons display weirdly, like smaller menu items on the main menu, however when I change those menu items from the icon to generic text, the menu item is normal again. I'm not exactly sure how to explain it, but it's currently live here > My Website
Hi there,
thats odd, they should not behave in that way.
Can you go to Customizer > General and:
1. Set the Icon Type to SVG
2. Set the Structure to Flexbox.
That fixed it =)
Derp! the buttons centered but they're still small (I have to basically mouse over the icon)
Very odd - i am not sure what the FA Icons are doing but its not respecting the menus line-height.
Try adding this CSS to fix that:
.main-navigation .main-nav ul li a i,
.main-navigation .gp-icon svg {
line-height: 60px;
}
.main-navigation .gp-icon svg {
height: 60px;
}That has fixed the issue, thanks very muchly =)
Glad to hear that
