PDA

View Full Version : CSS priority issues



jrroche
Sep 30th, 2009, 06:59 PM
I'm having trouble with some CSS priority issues, or at least I think that is where the problem is. I've got the following code:



a:link {
text-decoration: none;
}

a:active {
text-decoration: none;
}

a:visited {
text-decoration: none;
}

a:hover {
text-decoration: underline;
}

.my_story {
text-align: center;
font-weight: bold;
font-family: Arial-BoldMT, sans-serif;
font-size: 36px;
color: #8E8E8E;
margin-top: 15px;
margin-bottom: 15px;
line-height: 30px;
}

a.my_story: {
margin-left: 20px;
margin-right: 20px;
}


What I want is for the links in the my_story div to have the hover effect but also have all of the font, color, and margin settings of the my_story class. I don't want to apply these settings to other links. For some reason, the initial a: settings are taking priority, so that the my_story links do not accept color or margin changes (although for some reason they do take font, size, and text-align settings). Even setting the color directly in the a.my_story class doesn't seem to affect the link color, so I'm stuck with default blue and purple. Not sure how to fix this. I tried using !important to no avail. Any help would be appreciated.

Scriptet
Sep 30th, 2009, 07:11 PM
Hi,

To define additional changes to the links inside the mystory DIV you would use:


.my_story a {
/*css styles go here*/
}

You want to add any changes you want to the links inside the mystory div here, e.g link colour, or something else.

Because adding the color to just .my_story, only affects the color of normal text inside the DIV, not the colour of links, you must use .my_story a{} to do this.

Also just to note where you have used:

a.my_story: { }

This actually means links which have a class name of .my_story e.g
<a href="#" class="my_story">

But
.my_story a

means links inside something that has the class my_story, which is what you want.

jrroche
Sep 30th, 2009, 07:24 PM
Thank you! I am picking up CSS as I go, so I guess I just had the syntax of things confused. Thanks a lot!

Scriptet
Sep 30th, 2009, 07:27 PM
No problemo :)