Help with css link code – Solved

[nklewis777]

Have following code not acting appropriately (new to css and actively studying and learning) – Could somebody diagnose why visited link on left hand navigation bar is now staying white??

code as follows:

#mainconatiner {
background-color: white;
color: black;
width: 100%;
height: 640px;
position: relative;
}

#topmainheader {
background-color: white;
color: black;
font-family: verdana, sans-serif;
width: 100%;
height: 120px;
position: absolute;
top:0px;
}

#labelcontainer {
background-color: white;
color: #364355;
width: 100%;
height: 30px;
position: absolute;
top:120px;
}

#toplabel {
background-color: white;
border: 1px solid black;
color: #364355;
margin: auto;
padding: 5px;
font-family: verdana, sans-serif;
font-size:16px;
font-weight:bold;
}

#topnav {
background-color: #364355;
color: white;
font-family: verdana, sans-serif;
font-size:12px;
font-weight:bold;
width: 100%;
height: 40px;
position: absolute;
top:150px;
}

#topnav ul {
margin:0px;
padding:0px;
list-style-type:none;
margin-left:130px;
}

#topnav ul li {
display:inline;
height:30px;
float:left;
}

#topnav li a:link,a:visited {
display:block;
font-weight:bold;
color: white;
background-color:#364355;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 10px;
padding-right: 10px;
text-align:center;
text-decoration:none;
text-transform:uppercase;
}

#topnav li a:hover,a:active {
background-color:#7E2217;
}

#leftcolumn {
background-color: #364355;
color: white;
font-family: verdana, sans-serif;
font-size:12px;
font-weight:bold;
width: 120px;
margin-bottom: 10px;
position: absolute;
top:190px;
left:0px;
}

#leftcolumn ul {
list-style-type:none;
margin:0;
padding:0;
}

#leftcolumn a:link,a:visited {
display:block;
font-weight:bold;
color: white;
background-color:#364355;
padding-top: 10px;
padding-bottom: 10px;
text-align:center;
text-decoration:none;
text-transform:uppercase;
}

#leftcolumn a:hover,a:active {
background-color:#7E2217;
}

#rightcolumn {
background-color: white;
color: black;
font-family: verdana, sans-serif;
font-size:12px;
text-align:justify;
margins: auto;
position: absolute;
top:190px;
left:125px;
right:10px;
}

#rightcolumn a:link,a:visited {
font-weight:bold;
color: black;
background-color: white;
padding-top: 10px;
padding-bottom: 10px;
text-align:center;
text-decoration:none;
text-transform:uppercase;
}
#rightcolumn a:hover {
font-weight:bold;
color: #364355;
background-color: white;
padding-top: 10px;
padding-bottom: 10px;
text-align:center;
text-decoration:none;
text-transform:uppercase;
}

#bottomcr {
background-color: #364355;
color: white;
font-family: verdana, sans-serif;
font-size:9px;
width: 100%;
height: 40px;
position: absolute;
top:600px;
left: 0px;
}
That is stylesheet in its entire fashion (besides comments at top)

Thanks in advance

[Meta_Ing]

Specificity doesn’t carry between selectors separated by commas. In other words, rather than doing something like #topnav li a:link,a:visited, you’ll need to use #topnav li a:link,#topnav li a:visited

[nklewis777]

Thank you so much!!! Solved.

[Author]

Posts