How do I change the color of links when you hover over it?

Question

I'm trying to use the CSS stylesheet to change the hover color of every link, and I've tried:

tw-link:hover, .enchantment-link:hover {
 color: red;
}

.enchantment-link:hover, tw-link:hover {
 color: red;
}

tw-link.hover {
 color: red;
}

But none of them work.

Answer 1

Your 1st CSS rule, if placed within your project's Story Stylesheet area...

tw-link:hover, .enchantment-link:hover {
	color: red;
}

... will cause the colour of the following different link types to change to Red when the mouse cursor is placed over each of them.

[[Next Passage]]

(link: "Next Passage")[]

|banana>[Next Passage]
(click: ?banana)[]

 

Comments

Thank you! It suddenly decided to start working, I'm not sure why it wasn't.

---

I'm sorry, I am still learning CSS.

tw-link: hover, .enchantment-link: hover {
 color: #ff0000;
}

tw-link:hover, .enchantment-link:hover {
 color: #ff0000;
}

I typed in the first one without realizing there should be no spaces between ":" and "hover".

Answer 2

You could use this CSS to ensure a red hover color of every link.

a:hover {
 color: red !important;
}