There is a slight error in your code Battlesquid.
You used the ID selector in the CSS module:
But you referenced it as a class name when surrounding the links.
The solution is to modify Battlesquid's CSS module slightly:
FROM THIS:
[[module CSS]]
#redtext a {
color: #ff0000;
}
#redtext a:hover {
color: #c40000;
}
[[/module]]
TO THIS:
[[module CSS]]
.redtext a {
color: #ff0000;
}
.redtext a:hover {
color: #c40000;
}
[[/module]]
Note that I've changed "#redtext" to ".redtext"
Once you do that, it should take effect on the other change you already made:
[[div class="redtext"]]
link 1
link 2
link 3
[[/div]]
REMEMBER: Refresh without cache to test theme changes, otherwise your browser may not show the change immediately.
Instructions for multiple browsers can be found here.
Again, I don't think modifying the CSS theme will be necessary. We can always use the !important modifier to ensure our CSS module change takes effect, since you only want this change to affect one page and not other pages on your website. Editing the theme (to remove the a tag definitions) will affect other pages, too.
So if the above change (from "#redtext" to ".redtext" in the CSS module) does not have an impact, try this instead:
[[module CSS]]
.redtext a {
color: #ff0000 !important;
}
.redtext a:hover {
color: #c40000 !important;
}
[[/module]]
The only change above is adding the !important modifier. However, use this only if the first one above does not work. It is best to use the modifier only when it's explicitly required.
