Header & Footer Nav links different color on one page

Hello,

I just created this page: https://dailydosegrill.com/happy-hour/

I am using the same header & footer throughout the site (except homepage) and the nav link color is orange. On this page only, it has the nav links in the header & footer black.

I don’t have any custom CSS on the page level, but there is some element CSS but nothing for links.

I can’t seem to find why this is happening. Any help would be greatly appreciated.

Hello @zenzino,

Thanks for writing to us.

It seems that you have set the custom CSS code for the SPAN tag that is rendering on this page. It might be there in the page-specific CSS box. Please have a look at the given screenshot given below.

In case if it doesn’t work for you, please share your details in a secure note. Please provide the following details

  • WordPress Login URL
  • Admin level username and password

You can find the Secure Note button at the bottom of your posts

Thanks

Hi @prakash_s,

There is no page-level CSS. Only for elements.

Login attached.

Thanks

Hi @zenzino,

I check the page and it seems that you added some element CSS. I suggest that you review all the element CSS on the page and remove it all with span tag because it causing the menu to change the color.

Hope that helps.

Thank you.

Hi @marc_a,

I can’t format the way I need it formatted without the span tag.

I also have these tags & CSS on every page of the site but this is the only page it affects the header.

Why is an element CSS affecting the header on this page only?

Hi @zenzino,

Technically speaking if you have that CSS on the other pages, it should affect the header of the other pages but for some reason, it is not. After checking again your page, the reason why it is overriding the color of the span of the menu because you added !important, please remove that CSS span from your Midtown section element CSS. ( See secure note for more information). If you want to use the span tag and some custom CSS, I suggest that you add some unique CSS class names so that you can style your span. For example, this one, see the screenshot below.

Based on the screenshot above, I added a your-class CSS name. Then your CSS should be like this one, so that it won’t interfere with the other tags.

.your-class span {
	// your CSS code here
}

Hope that helps.

Thank you.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.