CODEWITHSUNDEEP
htmlcsshyperlinkstylesheet
Rob
Rob

Reputation: 65

Style styling links that it shouldn't be

I have a style that is styling the links on the navigation bar, but it styles all other links in the website, so I defined the div "menubar" as the selector infront of the link and visited selectors but it still styles all links in the website. Any solutions would be greatly appreciated.

CSS:

#menubar a:link, a:visited
{
    border-top-width: 1px;
    display: block;
    font-weight: bold;
    color: #000000;
    background-color: #EFF1EB;
    width: 180px;
    text-align: center;
    padding: 4px;
    text-decoration: none;
    text-transform: uppercase;
    border-style: solid;
    border-color: #638529;
    font-family: Arial, Helvetica, sans-serif;
    border: 1px;
    position: fixed;
}

Upvotes: 0

Views: 62

Answers (2)

Nicole Stutz
Nicole Stutz

Reputation: 516

I think @Yotam is right.

Another idea how to debug this. I use Web Development Toolbar inside Firefox. It has plenty of tools, one is to inspect the page. Use the one to see the style ( I like the 3D View), there you can press on the html element, in your case the link. Next to the page, it lists the style sheet definitions . The order shows what is the active style. Top is active, and everyhing else is lower and overwritten.

In this case, you may see, if your button has the correct definitions you want.

Upvotes: 1

Yotam Omer
Yotam Omer

Reputation: 15356

Your selector is wrong, change to this one:

#menubar a:link, #menubar a:visited /* width #menubar after the comma */

Your initial selector, #menubar a:link, a:visited means: "all links in #menubar and all visited links in the entire document". The comma starts a completely new selector so you have to include the parent also in the second selector.

Upvotes: 2

Related Questions