Question

this is the CSS code…

.breadcrumb {
    font-size: 10px;
    background-color: #006600;
    padding: 0px 2px 2px 2px;
    text-align: center;
    color: #FFFFFF;
}

.breadcrumb a {
    color: #FFFFFF;
    text-decoration: none;
}

.breadcrumb a:visited, .breadcrumb a:active {
    color: #FFFFFF;
}

.breadcrumb a:hover {
    text-decoration: underline;
}

and this is the code I am using to display a breadcrumb…

<p class="breadcrumb">Breadcrumb PHP code goes here</p>

I want the css code to be modified so that I can use id instead of class, as in:

<p id="breadcrumb">Breadcrumb PHP code goes here</p>

Can someone help?

Answer 1

Change the . in your CSS to #.

Having said that, you should ensure that there will only ever be a single instance of that p on your page at any given time if you’re going to use an id selector.