CODEWITHSUNDEEP
csshtmltagsnested
Fred James
Fred James

Reputation: 65

HTML/CSS Nesting issues

I want the "Accessibility" link to just be plain text like "Welcome to my site!" but it keeps taking the properties I set for my tags. This is my first time building a website so if you have tips about how my code looks I am open to suggestions. Thank You!

http://jsfiddle.net/kSNmS/1/

Upvotes: 1

Views: 101

Answers (2)

potench
potench

Reputation: 3842

The simplest solution is to change your CSS specificity for the <a> tags. Here's an article on CSS specificity that might help you: http://www.stuffandnonsense.co.uk/archives/css_specificity_wars.html.

So, to achieve what you want, change the following

a
{ 

    float:left;
    font-family: 'Alike', serif;
    width:17.50em;
    text-decoration:none;
    color:green; 
    background-color:silver;
    letter-spacing:5px;
    padding:0.5em 0.9em;
    border-width: 3px 1.5px 3px 1.5px   
}

to something with more specificity like 

ul a
{ 

    float:left;
    font-family: 'Alike', serif;
    width:17.50em;
    text-decoration:none;
    color:green; 
    background-color:silver;
    letter-spacing:5px;
    padding:0.5em 0.9em;
    border-width: 3px 1.5px 3px 1.5px   
}

Upvotes: 1

Nathan Arthur
Nathan Arthur

Reputation: 9096

How 'bout using a class on your nav links, and targeting them that way?

http://jsfiddle.net/kSNmS/4/

Upvotes: 1

Related Questions