In CSS, want to override my a:link and a:hover directives to for a specific span
- by brendan
This will probably be a softball for you CSS folks...
I have a site like this:
<div id="header">
<span class="myheader">This is the name of my awesome site!!!!</span>
</div>
<div id="content">whole bunch of other stuff</div>
<div="sidemenu"><ul><li>something</li><li>something else</li></ul>
<div id="footer">Some footer stuff will go here....</div>
In my css I have some directives to format the hyperlinks:
a:link { text-decoration: none; color : #ff6600; border: 0px; -moz-outline-style: none;}
a:active { text-decoration: underline; color : #ff6600; border: 0px; -moz-outline-style: none;}
a:visited { text-decoration: none; color : #ff6600; border: 0px; -moz-outline-style: none;}
a:hover { text-decoration: underline; color : #000; border: 0px; -moz-outline-style: none;}
a:focus { outline: none;-moz-outline-style: none;}
Now here is the problem. In my header I have some text that is a link, but I do not want to to format it like all the other links in the site. So basically I want my a:link, a:hover, etc to ignore anything in the "header" div. How can I do this? Assume I need to override this for that div/span?