[Resolved] Link formatting

Home Forums Support [Resolved] Link formatting

Home Forums Support Link formatting

  • This topic has 5 replies, 4 voices, and was last updated 2 months ago by Fernando.
Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #2246412
    Fredrik

    Hi!

    I would like to format the links on some of my sites so they get the same kind of look as they do on this page:

    https://jamesclear.com/five-step-creative-process

    In other words, I want the link to be underlined, with some distance between the word(s) and the line. When I hover over the linked word(s), I want the line to change colour and a background to appear behind the text.

    Is there a way to accomplish this?

    #2246438
    Ying
    Staff
    Customer Support

    Hi Fredrik,

    Give this CSS a try:

    .inside-article a {
        background-image: linear-gradient(to bottom, #FEF5DF 0%, #FEF5DF 100%);
        background-repeat: no-repeat;
        background-size: 100% 0;
        background-position: 0 111%;
        padding: 2px 2px 0px 0;
        border-bottom: 2px solid #E2DDCA;
        transition: all 0.3s;
    }
    .inside-article a:hover {
        background-size: 100% 88%;
        cursor: pointer;
        border-bottom: 2px solid #f8cd5f;
    }

    Adding CSS: https://docs.generatepress.com/article/adding-css

    #2246481
    Fredrik

    That worked like a charm. Thank you!

    #2246497
    Ying
    Staff
    Customer Support

    No problem 🙂

    #2246576
    Derek

    I added the same code to my site and nothing happened. I added it the additional CSS section.

    #2246620
    Fernando
    Customer Support

    Hi Derek,

    May you kindly start a new topic, and add the link to your site in the private information field?: https://docs.generatepress.com/article/using-the-premium-support-forum/#private-information

    We’ll take a look why it isn’t working for you.

    Hope to hear from you soon!

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.