[Resolved] Trying to style ONE menu item in the secondary menu

[Henry]

Hi Everyone

I’m trying to make one of the links in my secondary menu a different color to make it stand out…

Here’s the code as far as I can tell:

	<div class="main-nav">
		<ul class="secondary-menu sf-menu" id="menu-secondary-menu">
			<li class="recommended menu-item menu-item-type-post_type menu-item-object-page menu-item-22129" id="menu-item-22129">
				<a href="https://site.com/submission/">Add Events</a>
			</li>
			<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-19930" id="menu-item-19930">
				<a href="https://site.com/about/">About</a>
			</li>
		</ul>
	</div>

Can anyone point me in the right direction with this?

I tried the below but no dice…

.secondary-navigation .menu-secondary-menu li.recommended a {
   color: yellow;
}

FYI – you can see the class of “recommended” on the 3rd line down from the top code sample…

Thanks for all help with this

[David]

Hi there,

try:

.main-nav .secondary-menu li.recommended a {
    color: yellow !important;
}

[Henry]

Genius! Thank you!

[David]

You’re welcome

[Author]

Posts