Navigation
This is archived content. Visit our new forum.
  • Author
    Posts
  • #341152
    keithl
    Participant

    I’m using ethos.

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

    Thanks

    #341215
    DzinePOD
    Participant

    In CSS:

    a:hover {
    text-decoration:underline;
    }

    #341311
    Rue Nel
    Moderator

    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.

    #853416
    mhbmartijn
    Participant

    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!

    #853441
    Thai
    Moderator

    Hi @mhbmartijn,

    Please update the previous CSS a bit:

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

    Hope it helps πŸ™‚

    #853609
    mhbmartijn
    Participant

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

    #853783
    Christian
    Moderator

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

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

    Hope that helps. πŸ™‚

    #854209
    mhbmartijn
    Participant

    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!

    #854229
    Thai
    Moderator

    Hi There,

    Please add the following CSS:

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

    Hope it helps πŸ™‚

    #854275
    mhbmartijn
    Participant

    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;

    #854351
    Rupok
    Member

    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!

    #854405
    mhbmartijn
    Participant

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

    #854558
    Rue Nel
    Moderator

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

  • <script> jQuery(function($){ $("#no-reply-341152 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>