Question

I’m new to CSS. Ive created a Drupal site and playing with the theme.

I have some breadcrumb stuff that I would like to theme. If I go into Firebug and turn off the CSS properties

background
border-color
border-style

in the below code

.breadcrumbs .inner {
    background: none repeat scroll 0 0 #EFEFEF;
    border-color: #929292 #E2E2E2 #FFFFFF;
    border-style: solid;
    border-width: 1px;
    color: #8E8E8E;
}

I get the text looking exactly how I want it.

If I now go into my style.css which is inheriting the code and post

.breadcrumbs .inner {
    border-width: 1px;
    color: #8E8E8E;
}

The formatting I don’t want is retained. If I specify .breadcrumbs .inner in the style.css does that not set it up again and override what was specified higher up the cascade?

If that is not the case how do I stop the inheritance without changing the other style sheet?

Thanks,

Andrew

Additional Info

Here is what I have at the moment

This is what I want to have

Answer 1

You’re overriding CSS does not replace the 3 styles you want to change, so the original ones are maintained. What you likely want to do is have your style.css set something like this:

.breadcrumbs .inner {
    background: none;
    border-color: transparent;
    border-style: none;
}