Jump to content


Photo
- - - - -

Primary Nav Menu Text Color Change


This topic has been archived. This means that you cannot reply to this topic.
7 replies to this topic

#1 cshoffmann

cshoffmann

    Advocate

  • Members
  • 262 posts

Posted 15 November 2010 - 05:12 PM

I would like to know the CSS I need to put to make the Primary Nav Menu Text color change to white.

adding this to the custom css code is not working to make the change I want:

#nav ul li a {color:#fff;}

The site under development is

Please Login or Register to see this Hidden Content

.

I have tried various selector codes but have been unsuccessful.

thanks in advance!

#2 cshoffmann

cshoffmann

    Advocate

  • Members
  • 262 posts

Posted 15 November 2010 - 06:51 PM

Ok, so I figured out the answer to my question above by adding this to the custom css:

#primary-nav ul.sf-menu li a { /* ---------link font styles--------- */
color:#FFF;
}

BUT, now I cannot figure out how to make the hover text color and the active current page text color change to #000

Also, what is the styling to change the active and current link background colors including hover. I have tried to locate this in firebug and i have reviewed the other posts in the forum, but my amateur brain can't seem to grasp what to do.

#3 michaelmiles

michaelmiles

    Advanced Member

  • Members
  • PipPipPip
  • 45 posts

Posted 15 November 2010 - 07:22 PM

Here is a list of all css that is in the Main Nav for PlatformPro, I don't know what theme you are working on. Hover text is always found with the css selector 'hover' So for links, you will find the html link 'a' followed by ':hover' for hover based styling and ':active' for active based styling. You may not find what you are looking for because it may not be there. If the current theme doesn't have an active style in place, then you need to create it. Here are some examples from PlatformPro, if you have a different theme, then DON't copy/paste these....you need to tweak yours. If you are on a Mac, I suggest you get CSSEdit, this saves you enormous amount of time working with css styling...especially digging into other's work. FYI! /* @ Main Nav found in theme.css but can be over ridden in the custom code section of your theme settings */ /* this style is adding a border, keep in mind for color changes */ #primary-nav #nav_row {border-bottom: 1px solid #eee;} /* this style is setting the color, but keep an eye on font-weight for your custom color */ #primary-nav li a{ color: #777; line-height: 1.2em; padding: 10px 15px 10px; text-decoration: none; display: block; border: 1px solid transparent; border-bottom:none; font-weight: lighter; font-size: .8em; text-transform: uppercase; letter-spacing: .04em; } /*IE6 border color (transparent border fix)* -- also keep an eye on this when changing colors/ *html #primary-nav li a{border-color: white;} /* here is the hover color for the links in the nav bar */ #primary-nav .main-nav li a:hover{background: #F1F1F1;} /* this is how active works, this is for the subnav, if you need to add a style for your active link then follow this formula */ #subnav ul li a:active{color:#000;text-decoration:none;}

#4 cshoffmann

cshoffmann

    Advocate

  • Members
  • 262 posts

Posted 19 November 2010 - 05:24 PM

Thanks for the help. I need to still get a better understanding how to adjust the active page menu color, specifically I desire to get the active background to be: #657383 and the text color to be: #2B3856. FYI I have Headway Themes as well and this task is straightforward in the Admin. I love the Platform Pro and plan to stick to it, but I just wish there was a easier way to style color on multiple elements of Platform Pro. thanks and I look forward to finding the way to make this change.

#5 nett-ed

nett-ed

    Advanced Member

  • Members
  • PipPipPip
  • 53 posts

Posted 19 November 2010 - 06:33 PM

the current_menu_item and current_page_item are at your disposal to change the active page menu backgrounds.

and this should get you what you want

Please Login or Register to see this Hidden Content



#6 cshoffmann

cshoffmann

    Advocate

  • Members
  • 262 posts

Posted 19 November 2010 - 08:59 PM

Eduardo, I put that css in the custom css and I am still not getting the result needed. See the site:

Please Login or Register to see this Hidden Content



#7 cshoffmann

cshoffmann

    Advocate

  • Members
  • 262 posts

Posted 19 November 2010 - 09:09 PM

I went in and edited the theme.css file directly, so I guess when I need to upgrade in the future I may need to fix again. Is that right?

#8 catrina

catrina

    Advocate

  • Members
  • 12345 posts

Posted 19 November 2010 - 09:29 PM

Yes, you will have to. Just keep that in mind when you upgrade.