Archived topic
added image and button to nav. menu, but now they are misbehaving
3 replies · Started by James on May 10, 2019
Hello,
I've found how to add an image to the nav menu, and also make a social icon float in the right hand area. However, they seem to be misbehaving a bit now. The image in the nav menu appears to be aligned to the top, and the hover is always on, but seems to come and go depending on which page you're on. The social icon appears to be bottom aligned.
The code for the nav button is, i just have the URL pointing to my home page and nothing else:
The code for the social icon is:
and the css class is: menu-item-float-right
Thanks
Hi there,
first the logo/image - instead of adding that as a menu item why not use the Navigation as a header this will add your site identity logo to the navigation:
https://docs.generatepress.com/article/navigation-as-a-header/
For the social icon try this CSS:
.fb_iframe_widget span {
vertical-align: middle !important;
}The social icon CSS worked. However, if I make navigation my header then where/how do I put my leaderboard ad. in it's same slot?
Ok so with your current set-up try this CSS to remove the background colors on static and hover:
.nav-aligned-center .main-navigation .menu>li:first-child a, .nav-aligned-center .main-navigation .menu>li:first-child:hover a {
background-color: transparent;
}