[Support request] Links issue

Home Forums Support [Support request] Links issue

Home Forums Support Links issue

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1538482
    David

    Hi All,

    Still having issues with global links.
    On the page lined below there are images which are getting the hover background effect.
    Not sure how to NOT them – I have tried adding img and figure to NOT, experimenting!
    But I also have not(.gb-button) as well so not sure how to have two Nots ?
    Also, how would you configure this so the CSS below applies to all links except the home page ?

    Below is my current CSS

    TIA, Dave

    
    .site-content a {
        background-color: transparent;
    } 
    
    .site-content a:link:not(.gb-button) {
        color: inherit;
        text-decoration: none;
        transition: all 750ms cubic-bezier(0.4, 0, 0.2, 1);
        transition-property: all;
        transition-duration: 750ms;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-delay: 0s;
        border-bottom: 1px solid #d9e0ca;
        font-weight: bold;
    }
    
    .site-content a:visited:not(.gb-button) {
        color: inherit;
        text-decoration: none;
        border-bottom: 1px solid #d9e0ca;
        font-weight: bold;
    }
    
    .site-content a:hover {
        color: #0d47a1;
        background: #bbdefb;
    }
    
    #1538632
    David
    Staff
    Customer Support

    Hi there,

    if you want that style to apply only to Links within your text content try this:

    .site-content p a {
        background-color: transparent;
    } 
    
    .site-content p a:link {
        color: inherit;
        text-decoration: none;
        transition: all 750ms cubic-bezier(0.4, 0, 0.2, 1);
        transition-property: all;
        transition-duration: 750ms;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-delay: 0s;
        border-bottom: 1px solid #d9e0ca;
        font-weight: bold;
    }
    
    .site-content p a:visited {
        color: inherit;
        text-decoration: none;
        border-bottom: 1px solid #d9e0ca;
        font-weight: bold;
    }
    
    .site-content p a:hover {
        color: #0d47a1;
        background: #bbdefb;
    }
    #1538643
    David

    Ah of course, thanks – I’ll implement that!
    Dave

    #1538672
    David
    Staff
    Customer Support
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.