[keithlParticipant]

I’m using ethos.

How do i set it up so when i hover over a text hyperlink, it underlines the text?

Thanks

[DzinePODParticipant]

In CSS:

a:hover {
text-decoration:underline;
}

[Rue NelModerator]

Hello There,

Thanks for writing in!

Yes, that is correct. @dzinepod gave the css that will have an underline when you hover on a link. Please add this code in your customizer, Appearance > Customize > Custom > CSS

a:hover {
  text-decoration:underline;
}

Hope this helps. Kindly let us know.

[mhbmartijnParticipant]

So I would like to ask how to change this, so that only text gets a underline. Because with the script above my buttons and social icons get an underline as well.

Thanks!

[ThaiModerator]

Hi @mhbmartijn,

Please update the previous CSS a bit:

a:hover {
  text-decoration: underline;
}
a.x-btn:hover {
  text-decoration: none;
}

Hope it helps 🙂

[mhbmartijnParticipant]

Thanks! There is still an underscore under my social icons, any way to fix this?

[ChristianModerator]

Please add the code below in your Appearance > Customize > Custom > CSS.

.x-social-global a:hover {
    text-decoration: none;
}

Hope that helps. 🙂

[mhbmartijnParticipant]

Worked, thanks!!

Another question about underline. The menu in my footer is not giving an underline. I would like the color to be the same while hovering and give it an underline? Would you please help me with this as well? Thanks so much!

[ThaiModerator]

Hi There,

Please add the following CSS:

.x-colophon.bottom .x-nav li a:hover {
    opacity: 1;
    text-decoration: underline;
}

Hope it helps 🙂

[mhbmartijnParticipant]

Like yeah this works for the footer menu, but with this added my former code doesn’t work anymore, no more underline in the rest of the page.

a:hover {
text-decoration: underline;}
a.x-btn:hover {
text-decoration: none;}
.x-social-global a:hover {
text-decoration: none;}

.x-colophon.bottom .x-nav li a:hover { opacity: 1;
text-decoration: underline;

[RupokMember]

Hi there,

Thanks for updating. Your given code is not closed properly. Make sure to close all of your code with curly braces. You can test your CSS from http://csslint.net/

Hope this helps.

Cheers!

[mhbmartijnParticipant]

Whooops, newbie mistake, sorry… but yeah everything works the way I want it. Awesome, thanks a million!

[Rue NelModerator]

No Problem. You’re most welcome!
We’re glad we were able to help you out.

[Author]

Posts