Another CSS issue (style hyperlinks)

(Christoph Schmitz) #1

Hi, CSS pros!

I am struggling now for a few days with a supposedly simple CSS problem. I want to style hyperlinks. In order to apply custom CSS, I tried Joe’s CSS Box stack (BTW: I have the same issue with DeFliGra’s CSS on the fly stack).

The CSS Box stack has the class “cssbox”.

My (example) CSS code looks like that:

.cssbox a:link{color:blue}
.cssbox a:hover{color:red}

The hover color is applied, but the link color is not. Interestingly I can easily change the background color of “.cssbox a:link”. On the website, where I observed this issue for the first time, it was exactly the other way around: the link color was applied, but the hover color was not.

Adding “!important” does not solve this issue.

I created a tiny test website, which illustrates the problem:

Thanks in advance for any advice!


(Will Woodgate) #2

Two things,

  1. Your theme is applying grey text to visited links, so you will want to target those too with the :visited pseudo selector. You have set your test link to the same link as the page being viewed, which is why it is taking visited colouring.
.cssbox a:visited{color:blue}
  1. Ask the theme developer for an update to fix the missing theme colours. I still see things like %colour_links% in your source code.

(Jeroen Roos) #3

The href of the link is empty. Give the link an URL (even a # will do) and your CSS will work.

Alternatively, remove the :link part of the CSS, and it will work with an empty href.

(Christoph Schmitz) #4

I would like to thank you both! Now it works.

One additional question: do you have any idea, why it works only if I add the CSS on each page? It does not work if I add the code to Settings > Code > CSS.

(Will Woodgate) #5

If you are using RW8, I think there is a bug that prevents CSS being written into the page. I have not been able to replicate it myself, but a couple of others have hinted there have been problems for them and have reported it to support.

(Christoph Schmitz) #6

Thanks Will! That’s good to know! Interestingly some CSS seems to be written, but not all.