CODEWITHSUNDEEP
css
Cindy
Cindy

Reputation: 1

Text color of unvisited link appears as default blue

I have navigation links on my home page that I want black text on a pink background. I want the text to be black in all link variations, but the default color of blue still appears on a link in its normal state. It is black when the link is visited. I have tried different remedies (adding !important, changing the order of the css, using the hexidecimal code for black instead of the word black) but nothing has solved the problem. This is the code right now. What am I doing wrong?

body{background-color:#CC6699}

#header {   border: medium dotted #000000;
padding: 20px 0px 20px 0px;
color: black;
font-family: Broadway;
background-color: aqua;
text-align: center;
height: 250px;    }
#logo { padding-left: 30px; float:left;}



#wrapper {width:900px; margin:0 auto; background-color:#ffffff; color:black;}

#bar {
background-color: #000000;
height: 200px;}



#content {
margin: 0px;
padding: 10px 0px 10px 0px;
font-family: Verdana;
font-size: large;
text-align: center;
background-color: #ffffff;}
#nav {
width: 900 px;
margin: 0 0px 0 0px;
overflow: hidden;}
#nav ul li {
display: inline;}

#nav ul {
width:100%;}

#nav li {
border-style: solid;
border-width: thick;
border-color: #00FFFF;
margin: 40px 10px 40px 10px;
font-family: "Arial Rounded MT Bold";
font-size: large;
padding: 10px 30px 10px 30px;
background-color: #CC6699;
text-align: center;}

#nav a:{
color: #000000; margin: 10px;}
#nav a: link { color:black;}
#nav a:visited {color:black}
#nav a:focus {  color:black;}


#nav a: hover {color:black;}
#nav a:active {color:black;}


img {
padding: 20px 30px 20px 30px;}

Upvotes: 0

Views: 925

Answers (1)

Praveen Kumar Purushothaman
Praveen Kumar Purushothaman

Reputation: 167192

Please change the wrong code:

#nav a:{
color: #000000; margin: 10px;}
#nav a: link { color:black;}
#nav a: hover {color:black;}

To:

#nav a{ /* remove : after a */
color: #000000; margin: 10px;}
#nav a:link { color:black;} /* remove space after a: */
#nav a:hover {color:black;} /* remove space after a: */

Upvotes: 1

Related Questions