How to apply a sifr rule to a hyperlink and also its a.active counterpart


Tags: css,class,sifr,rules

Problem :

Have a hyperlink inside of a h1... like so:
<h1 id="site-name"><a href="blah">blah</a><h1>

I apply a sifr3 rule to the css: h1#site-name

then inside sifr3-rules.js i apply the following rules... "a": { "text-decoration": "none" }, "a:link": { "color": "#FF0000" }, "a:hover": { "color": "#00FF00", "text-decoration": "none" }

But i realized in my Drupal site, it automatically adds .active class to the hyperlink, and the default link color won't work (however unusually the hover works)...

How can I set the rule so something like "a.active": { "color": "#FF0000" } gets applied? [that does't do anything btw, but i thought maybe it would help it out]



Solution :

I don't believe Flash lets you select links with a class name (a.active). Best bet is to put the active class on the h1 instead. You can then replace h1.active to do the different styling. Make sure to replace it before the other h1s though.


    CSS Howto..

    How to embed a php/javascript photogallery in a page of an html/css website?

    How to set img tag vertical center : html + css

    How can I add to an image an HTML link using Google Chrome extension?

    CSS check box, how to make an item unchecked only if another one is checked

    How to remove the margin top from a div with display table-cell?

    How do I display content in a way like UICollectionView on the web?

    How to create a loading image sprite using background position

    How to set the maximum height of CSS tables?

    How to offset div columns in CSS grid system

    How to add CSS tag to ruby on rail loop?

    How can I vertically align the text on these CSS buttons?

    how to make css curve box with gradient & shadow

    How to solve this (seemingly simple) formatting problem in CSS?

    Any idea how to add this sinking hover effect to an image/link?

    How to get rid of CSS cascading in internal element widgets

    CSS + Show Animated GIF while Loads

    CSS causing red frame around lightbox image - how to remove?

    how to scale img by percentage of self and not percentage of its container

    How do you change the appearance of a button in javascript?

    How can I fix left menu in bootstrap 3.0? [closed]

    How to stretch parent div to fit children div?

    How to add CSS reference link to local HTML files in folder?

    How to use CSS Class and ID selectors

    How can I reduce the amount of vertical space between lines of text using CSS?

    How can i overlap inline divs?

    How to set height to wrap text only in certain screen size

    Using CSS how to change only the 2nd column of a table

    How can I stop divs getting pushed down?

    How to add slide animation when showing elements

    how to get double border in using CSS?