I have the theme set to Breeze for my Sharepoint site and noticed that the 'Home' Top Navigation button stays a dark grey no matter which page I am on. Is it possible using CSS to change all the navigation to one color and have the active navigation button to change to a specific color? Here is a link showing the issue I am having. http://i56.tinypic.com/2z4fq6t.jpg

Hi Randolph, I think you know the answer is yes of course... Check out Heather Solomons CSS Chart http://www.heathersolomon.com/content/sp07cssreference.htm where she lists every Style used. You should probably read everything she writes she knows SharePoint.... Also, use the IE Developers Toolbar just hit f12 in IE and it will pop up... -Ivan Ivan Sanders My LinkedIn Profile, My Blog, @iasanders.

Ok I have tried the IE Devlopers Toolbar and can not access it. I guess the IT department has it locked out. I have tried the following code in CSS using the Content Editor and it changed the color of the 'Home' button but does still will not change the color when on the active button. .ms-topnav{ border:solid 1px #c2dcff; border-left:solid 1px #ffffff; border-bottom:none; background-image:url("/_layouts/images/topnavunselected.gif"); background-repeat:repeat-x; font-family:Tahoma; font-size:8pt; background-color:#e2efff; color:#3764a0; } .ms-topnav a{ display:block; white-space:nowrap; padding:1px 8px 0px 8px; height:18px; } .ms-topnavselected{ color:#003399; background:url("/_layouts/images/topnavselected.gif"); background-repeat:repeat-x; font-weight:bold; border:solid 1px #79a7e3; border-bottom-width:0px; border-left:solid 1px #e3efff; background-color:#6593cf; } .ms-topnavselected a{ color:#003399; }

At this point I just want to change all the Top Links buttons to one color. I am pulling my hair out on this one. I have no idea why the Home button stays a dark shaded color. I have read through all the information provided by Heather Solomons CSS Chart and can not determine why this one button is remaining shaded. I tried the CSS code that she provided to no avail.

I am pulling my hair out on this one. I have no idea why the Home button stays a dark shaded color. I have read through all the information provided by Heather Solomons CSS Chart and can not determine why this one button is remaining shaded. I tried the CSS code that she provided to no avail.

I found out why one of the buttons on the Navigation Bar was remaining shaded. It appears that the HTML had .ms-selectednavheader set on just that tab. It has been removed out of the HTML. I am still trying to set the CSS to change the color of the navigation button when a certain navigation button is selected/active. Using Heather Solomons CSS Chart I am now trying to change the color of of the selected/active navigation button. I have tried the following but the color of the navigation button remains the same. Am I missing something? .ms-topnavselected{ color:#003399; background:url("/_layouts/images/topnavselected.gif"); background-repeat:repeat-x; font-weight:bold; border:solid 1px #79a7e3; border-bottom-width:0px; border-left:solid 1px #e3efff; background-color:#6593cf; } .ms-topnavselected a{ color:#003399; }

Here is what it shows when I do View --> Source for the Navigation Bar. I am thinking that I need to insert ms-topnavselected somewhere in the HTML but not sure where.... <TD id="onetIdTopNavBarContainer" WIDTH=100% class="ms-bannerContainer"> <table class="ms-bannerframe" border="0" cellspacing="0" cellpadding="0" width="100%"> <tr> <td nowrap valign="middle"></td> <td class=ms-banner width=99% nowrap ID="HBN100"> <table id="zz1_TopNavigationMenu" class="ms-topNavContainer zz1_TopNavigationMenu_5 zz1_TopNavigationMenu_2" cellpadding="0" cellspacing="0" border="0"> <tr> <td onmouseover="Menu_HoverRoot(this)" onmouseout="Menu_Unhover(this)" onkeyup="Menu_Key(this)" id="zz1_TopNavigationMenun0"><table class="ms-topnav zz1_TopNavigationMenu_4" cellpadding="0" cellspacing="0" border="0" width="100%"> <tr> <td style="white-space:nowrap;"><a class="zz1_TopNavigationMenu_1 ms-topnav zz1_TopNavigationMenu_3" href="http://workspaces.humana-military.com/sites/srnetdev/default.aspx" accesskey="1" style="border-style:none;font-size:1em;">Home</a></td> </tr> </table></td><td style="width:0px;"></td><td style="width:0px;"></td><td onmouseover="Menu_HoverRoot(this)" onmouseout="Menu_Unhover(this)" onkeyup="Menu_Key(this)" id="zz1_TopNavigationMenun1"><table class="ms-topnav zz1_TopNavigationMenu_4" cellpadding="0" cellspacing="0" border="0" width="100%"> <tr> <td style="white-space:nowrap;"><a class="zz1_TopNavigationMenu_1 ms-topnav zz1_TopNavigationMenu_3" href="http://workspaces.humana-military.com/sites/srnetdev/Contracts/Forms/AllItems.aspx" style="border-style:none;font-size:1em;">Contracts</a></td> </tr> </table></td><td style="width:0px;"></td> </tr> </table> </td>

Hi Randolphoralph, I am also facing similar problem. But I am able to change all the navigation to one color, say: <style type="text/css"> .ms-topnav, .ms-topnav a{ background-color:#038bd9; background-image:none; color:#ffffff; </style> or if you like Custom Background Color and Image (say, gradient image of width:4px and height:16px) to appear same for all tabs: <style type="text/css"> .ms-topnav, .ms-topnav a{ background-color:#038bd9; background-image:url('/site/PictureLibrary/SiteImages/CustomImage.gif'); background-repeat: repeat-x; color:#ffffff; } </style> The reason why TopNavSelected is not working may be "Contracts" is not a subsite, it may be a list/library. Still I am not sure. Hope this helps. Please post it as Answer if it works. Thanks, Chinna. Sharepoint Dev.