How do I change the breadcrumb ">" color?

[macromark]

I changed the breadcrumb text color in the style.css sheet but the ">" symbol between links stayed the same very faint color. How can I change the color of the symbol?

Thanks in advance...

Mark

[s_ismail]

You can change color of symbol in '.breadCrumbPanel ' css class like this

Code: Select all

.breadCrumbPanel {
    background:#FFFFFF url(images/CategoryBreadCrumbsEdge.gif) no-repeat left top; padding: 8px 0;color:'YOUR_COLOR_HERE'; 
    font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; font-weight:lighter; text-indent:16px;}

[macromark]

Thanks. However, I did change that and it changed the link color but not the ">"... that's the problem I'm having. See my attachement.

[macromark]

Anybody??

[plugables]

Well seems like code change is inevitable. You can't do this with CSS alone.

Open ConLib/BreadCrumbs.ascx and change the following line

Code: Select all

<PathSeparatorTemplate><asp:Localize ID="PathSeparator" runat="server" Text=" > "></asp:Localize></PathSeparatorTemplate>

to something like

Code: Select all

<PathSeparatorTemplate><span class="CrumbSeperator"> <asp:Localize ID="PathSeparator" runat="server" Text=" > "></asp:Localize></span></PathSeparatorTemplate>

Use the class CrumbSeperator in your css file to set your desired style.

Code: Select all

.CrumbSeperator {color:red;}

[clevername]

You can do this with css alone.
Because the breadcumbs are made of links so all of those colors are changed with their ".CategoryBreadCrumbs a" css. So if you change the "color:#xxxxxx" on the ".CategoryBreadCrumbs" to a color you want it will make the text that is not a link that color. And in this case the ">" is the only thing left.

so change this

Code: Select all

.CategoryBreadCrumbs {
    padding: 3px 0; background:#FFFFFF url(images/CategoryBreadCrumbsEdge.gif) no-repeat left top; color:#000;
    font-family:Verdana, Arial, Helvetica, sans-serif; font-size:7px; text-indent:16px;}

...Your breadcrumb class may be different but the concept is the same

[macromark]

Looks like "clevername's" CSS suggestion did the trick. VERY MUCH APPRECIATED! thank you both.