Problems with CSS in the Breadcrumb Trail

[Charlesn]

Hi All,

I'm having a few problems with the CSS in my breadcrumb trail for a new site:

http://www.greatmusic.co.uk/acatalog...og/Comedy.html

As you can see, there seems to be about 3 different styles (the last of which is right, it should be white. I know its a bit small, I'll change that). If I go in and manually hardcode the .breadcrumbs style I've created in the 'List Layout Settings', nothing seems to happen. If I right click on it and 'Edit Appearance' the CSS styles it offers doesn't give me the option of my .breadcrumbs style. To be perfectly honest I'm not even completely sure how I managed to get the bit that is appearing correctly, to appear correctly!

As always, any help is much appreciated. And yes, I know this is a duplicate post as I accidentally posted this in the V8 General section (as leehack so kindly pointed out) so apologies in advance.

Cheers
Charlie

[fergusw]

Charlie,

The Breadcrumb HTML in V8 is a little spread out, plus the styling to control them is slightly different for each one as you are finding out.

To explain the difference you need to know the difference between applying style properties to <a> HTML elements and non <a> HTML elements.
i.e. to links and basic text
as the way you need to write the CSS properties and apply them are different depending on which one you want to style.

You can find most of the code to generate the breadcrumb either by clicking on it in the design tab or by looking in
"Parent Section List Entry" in the library.

I would look at reseting this back to original as you have all sorts of <em>, <b>, <strong> and other tags cluttering up the breadcrumb.
Look to identify each element and assign each one a CSS class and style each one accordingly through the classes.

[Duncan Rounding]

There are two styles: one from
body, table, th, td {actinic.css (line 2)
color:#000000;
font-family:Verdana,Geneva,Arial,Helvetica,sans-serif;
font-size:x-small;
}
the other from:
a:hover {actinic.css (line 67)
color:#EE0000;
font-size:x-small;
text-decoration:underline;
}


You could try resetting ParentSectionListBottom and ParentSectionListTop but I don't think you have class 'link_breadcrumbs' or 'breadcrumbs' defined in your css file.

You also have some other 'funnies' between FF and IE7.

[Charlesn]

Thats pretty much what I thought, but it still seems to be getting something from elsewhere as it just not appearing as it should. My CSS is as follows in the Actinic.css

.mybreadcrumbs{font-family: Geneva, Arial, Helvetica, sans-serif; font-size: 10px; color: #FFFFFF;}
}
.mybreadcrumbs a:link { 
 color: #FFFFFF;
 text-decoration: none;
 }
.mybreadcrumbs a:visited { 
 color: #000000;
 text-decoration: none;
 }
.mybreadcrumbs a:hover { 
 color: #000000;
 text-decoration: underline;
 }
.mybreadcrumbs a:active { 
 color: #FFFFF;
 text-decoration: none;
 }

Is there some secret way of applying CSS that I don't know about?! At present I'm just right clicking on the breadcrumb trail, selecting Edit Appearance and then applying my CSS style. Or is my CSS wrong?

As always, any help is much appreciated.

Cheers
Charlie

[Charlesn]

I changed it as there appear to be a couple of styles in the Actinic.css file with names containing 'breadcrumbs' so I made sure Actinic wasn't confusing the styles by renaming mine.

Doesn't seem to have made any difference though

Cheers though.

C

[peblaco]

You've got 3 different names of breadcrumb styles. It would be easier if they were just one name and you can look at the styling from there.

[los_design]

C

are you using a custom style sheet and/or actinic.css?

If using custom, tale the blimming annoying css out of the code <!-- --> I always do.

[Charlesn]

Louise,

I can't thank you enough for your help and patience with this. Finally have it sorted now. It was indeed the span class, which I deleted (didn't do anything) then replaced with span class=mybreadcrumbs - which fixed it good and proper. I also sorted out the issues with it repeating itself (the code was repeated for some reason so I just deleted half of it).

Works like a charm now.

Just need to fix my Safari preview problems now...

Cheers
Charlie