problem with css

Question

what is wrong in this code? css is not working

<style type="text/css">
    .mail a:link {
        color: grey;
    }

   .mail a:visited {
        color: grey;
    }

   .mail a:hover {
        color: white;
    }
</style>

<a class="mail" href="mailto:[email protected]">E-mail: [email protected]</a>

Answer 1

Your css styles apply to anchor elements that are descendants of .mail and not the anchor elements with class name mail.

Change the style definitions to as below:

<style type="text/css">     
    a.mail:link {         
        color: grey;     
    }     

    a.mail:visited {         
        color: grey;     
    }     

    a.mail:hover {         
        color: white;     
    }   
</style> 

Answer 2

'a' is not a descendent of .mail.

Try a.mail