Site logo

Archived topic

Home Page Nav Button Not showing up on other pages

12 replies · Started by Max on March 14, 2017

Viewing posts 1–13 of 13

Hi Max,

Looks like your CSS is targeted to the current menu only: .generate-merged-header .main-navigation:not(.is_stuck):not(.toggled) .main-nav > ul > li[class*="current-menu-"] > a

It would probably be better if you add the CSS to the nav-button class you've already added to the CSS Classes for that menu item.

Let me know if this helps.

If I just remove the "current class" aspect of the css, what would that look like so it stays styled across the board?

Try it. I would assume that would target to every menu item.

lol I just did and it made my menu go crazy! All the tabs had buttons.

I had it simply targeting the nav button across the board until I made the background fill the entire screen and then I had to add more code and target the button directly I guess.

Any ideas on that code as a whole?

Thanks so much! I am trying to learn the targeting ins / outs for this theme.

Hi Leo!

Yes, it was working until I added the background image to fill the entire screen.

I think you gave me the new code I am using now to target the button while using that feature.

However, the new code came with that "current menu" tag and I am having trouble making it work now.

Thanks so much for your help.

If you check out the site now, this is how the button looked prior to adding the background image feature.

Once I added the new code snippet, the button worked properly again however that new code added some problems.

Hope that makes sense.

Can you try the original way again so I can take another look?
Don't think adding the background image would have change the style of menu items unless I'm missing something.

Ok!

I set it back to the original targeting.

You can see the button is just outlined with the color I want and no matter what I add, it stays that way.

Thanks Leo!

Try this instead:

.main-navigation .main-nav ul li.nav-button a {
        background-color: #4e5e78 !important;
	border: 1px solid #4e5e78;
	color: white !important;
	padding-left: 25px;
	padding-right: 25px;
	padding-top: 6px;
	padding-bottom: 6px;
	border-radius: 3px; 
	margin-left: 18px;
	margin-top: -4%;
	font-size: 15px;
	letter-spacing: 3.7px;
}

It worked!

Leo, you rock! I swear I thought I tried that but I think I had my semi-colon in the wrong spot.

Thanks bro, you guys are amazing.

You're welcome :)

This archived topic is closed to new replies.