giedreja

The code you suggested only worked when I put ‘!important’ at the end of each line.

Then, to make the link appear underlined only when the user hovers over it, I tried applying the original CSS to .entry-content a:not(.more-link):hover. However, the whole link text ended up having the blue background instead of just a line underneath (I’m guessing it’s just a bug in the theme).

I finally managed to solve this problem by looking at one of the examples from this discussion thread:

.entry-content a:hover {
  color: #2ab2f5;
  background: linear-gradient(#fff 95%, #2ab2f5 5%)!important;
}

It now works just the way I wanted.

Thanks again for your help.

Hi paulwpxp, thanks for your reply. Unfortunately, the code you suggested didn’t work…

My goal was to make links a different colour and have the line appear only when the user hovers on the link. Which would solve the user experience problem you mentioned.