Black highlight around clicked links

  • Resolved bmckechnie

    (@bmckechnie)


    1 year, 4 months ago

    I have a very simple newsletter sign-up landing page located at https://cur8te.com/ that has one issue I can’t sort out. When someone clicks a link the text turns white and the link is highlighted in black (it also irks me that when you hover over a link the underline turns to dots). I have tried a bunch of CSS code that suggests it should fix this but nothing changes. I am using the free version of Options for Twenty Twenty-One plugin but don’t see anything in there that would be affecting this. It’s a minor issue but driving me nuts and I’d like to fix it.

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)
  • Moderator jordesign

    (@jordesign)

    Hey @bmckechnie,

    That styling of ‘focused’ links is part of the default setup of the Twenty Twenty-one theme – and you’re correct, it doesn’t look like there’s settings anywhere to change that.

    It looks like it is possible to use some CSS to change that though. Could you please try going to the Customizer (Appearance > Customize) and then adding the code below to the ‘Additional CSS’ section.

    /* Remove focus style on links */
.has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {
	background:unset;
	color:unset;
	text-decoration:underline;
}
    Thread Starter bmckechnie

    (@bmckechnie)

    It got rid of the black box that appears when you click (I still get the dots when I hover over the link but the box was the biggest issue so I can live with the dots). Thank you so much for your help with this!

    Moderator jordesign

    (@jordesign)

    Thanks @bmckechnie – If you wanted to change the hover styles as well you could try this…

    .site a:hover:not(.wp-block-button__link):not(.wp-block-file__button) {
    text-decoration: underline;
    text-decoration-thickness: 1px;
}
    Thread Starter bmckechnie

    (@bmckechnie)

    You have fixed all of my issues ?? Thank you!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Black highlight around clicked links’ is closed to new replies.