Posts: 226
Name: Chris
Location: West Yorks , UK
|
Hi,
I was wondering if someone would be kind enough to point out to me where i'm going wrong here.
my links seems to be inheriting styles from another css statement and i'm unsure how to fix it.
For example - if i change the virus list colour to Red - for example - then my top navigation will also change to red as well. I tried to sort this out yesterday but i seem to be tying myself in knots.
What i want to be able to do is change the link colours on both sidebars and top menu and footer independently. I know this has something to do with specifity - but i am having trouble working it out and even fully understanding the concept.
I am plannning to read up in it this morning - but i did star t earlier yesterday and got nowhere!
i hae isolated what i think is each instance of styling a link in the code pasted below.
The page in question is http://www.matrixitcomputers.co.uk/n...-reloaded.html
the code this below.
Thanks in advance.
*************************************************
CSS Link statements
*************************************************
a {color: #6699ff;}
a:link, a:visited{color: #6699ff;
}
*************************
/*** some yellow colour here **/
#wrapper .menulist a, #wrapper .menulist a:visited {
color: #000000;
border-left: 6px solid #FFD940;
padding: 0 0 0 6px;
}
#wrapper .menulist a:hover {
border-color: #000000;
}
************************************************
.chromestyle ul li a{
color: #fff;
padding: 4px 7px;
margin: 0;
text-decoration: none;
border-right: 1px solid #DADADA;
}
.chromestyle ul li a{
color: #fff;
padding: 4px 7px;
margin: 0;
text-decoration: none;
border-right: 1px solid #DADADA;
}
.chromestyle ul li a:hover{
background: url(img/menu/bg_over.jpg) center center repeat-x; /*THEME CHANGE HERE*/
padding-bottom: 10px;
*******************************
.dropmenudiv a{
width: auto;
display: block;
text-indent: 3px;
border-bottom: 1px solid #BBB; /*THEME CHANGE HERE*/
padding: 2px 0;
text-decoration: none;
font-weight: bold;
color: #6699ff;
}
* html .dropmenudiv a{ /*IE only hack*/
width: 100%;
}
.dropmenudiv a:hover{ /*THEME CHANGE HERE*/
background-color: #000;
}
***********************************
#center a:link {
color: #6699FF;
}
#center a:visited {
color: #6666CC;
}
#center a:hover {
color: #6699FF;
}
************************************
#left a:link {
color: #000033; /*** thois is the offending specifity bug - was 003333**/
}
#left a:visited {
color: #333399;
}
#left a:hover, a:active {
color: #333;
}
***********************
#right a:link {
color: #000000;
}
#right a:visited {
color: #6633FF;
}
#right a:hover {
color: #6699FF;
}
.arrowlistmenu ul li a{
color: #A70303;
background: url(img/arrowbullet_bk.png) no-repeat center left; /*custom bullet list image*/
display: block;
padding: 2px 0;
padding-left: 19px; /*link text is indented 19px*/
text-decoration: none;
font-weight: bold;
border-bottom: 1px solid #dadada;
font-size: 90%;
}
.arrowlistmenu ul li a:visited{
color: #A70303;
}
.arrowlistmenu ul li a:hover{ /*hover state CSS*/
color: #A70303;
background-color: #333333;
}
*************************************
#footer a:link {color: #999999;}
#footer a:visited {color: #666666;}
#footer a:hover {color: #FFFFFF;}
|