-
I have a simple pattern, for Related: Link Name Here
I have dabbled in the hover colours and link colours, but what I want is for Related to stay White (It currently changes to a blue) and the Link text to be white starting point, and when hovered over turn to blue. I cannot seem to accomplish this. Any help appreciated and I have left a link to a page in PI.
-
Alvind
Hi there,
To change the link hover color, you need to use the Hovered Links selector:

-
Hi Alvind,
And what do I do from there? I have been doing it all wrong, whenever I wanted hover, I always went on hover. I have never used this selector before. Do I need link text in already? As you can see, I only have (Related:) in atm but that is to stay white, should I write something like – Link Text Changes Here
Just as a template?
I am currently here https://ibb.co/Xfgtjyw6
What do I do from here?
Thanks
-
Do I need link text in already?
I’m not sure what you mean, can you explain some more?
I am currently here https://ibb.co/Xfgtjyw6
What do I do from here?
Once the
a:hoverselector is selected, you can go to the typography panel to set a text colour for the hovered link. -
Do I need link text in already?
I’m not sure what you mean, can you explain some more?
I meant after Related: (Which will be plain text) there’s no text, so e.g Link Goes Here. I was asking if I needed to add text but nevermind I didn’t need to I found out.
So I got it done, but my word is this confusing… I just can’t understand what the function of hover is then and the point of it being there tbh, seems void. The fact I was looking in the wrong place on Hover to make the colour change when hovering and all along it was in the Hovered Links selector seems bizarre to me. I know now, but people going forward might find this a little confusing.
Last thing, when I’m adding text/links there, some text will be short and some will be long, how do I get the black background to stop at the last letter so there’s no black background space at the end on the right?
Thanks Ying
-
how do I get the black background to stop at the last letter so there’s no black background space at the end on the right?
You can set the text’s display to inline-flex, inline or inline-block, which makes the block as wide as the content goes 🙂
-
Okay great! Thanks for all the help Ying and Alvind.
I will mark this as resolved now 🙂
-
You are welcome 🙂
- You must be logged in to reply to this topic.