Why do my hyperlinks have long underlines and how can I remove them?

[CanamSystems]

Hi,

It seems all the texts on my website with a hyperlink now have a long underline right after the text. See one of the examples in the screenshot below. I wonder why this happened and how can I fix this? Thank you!

[KetanKumar]

@CanamSystems

sorry for that issue can you please share us store url

[dmwwebartisan]

@CanamSystems

Please share your store URL.

[CanamSystems]

https://canamsys.com/

[KetanKumar]

@CanamSystems

thanks for URL, yes please add this code

1. Go to Online Store->Theme->Edit code
2. Asset->/timber.scss.liquid->paste below code at the bottom of the file.

.rte .text-link {
    border-bottom: none;
}

[CanamSystems]

I tried it and now my page looks like this:

[KetanKumar]

@CanamSystems

something is missing

[CanamSystems]

Hi I tried the code again and now even though the said line is not visible, but it still shows when I mouseover any of the texts with a hyperlink.

[dmwwebartisan]

@CanamSystems

1. Go to Online Store->Theme->Edit code
2. Asset->/timber.scss.liquid->paste below code at the bottom of the file.

.rte .text-link:focus, .rte .text-link:hover {
    border-bottom: 0px solid #1f60ac !important;
}

.rte .text-link{
      border-bottom: 0px solid #1f60ac !important;
}

Thanks!

[CanamSystems]

@dmwwebartisan

Now the line is not visible at all, but you will see the a huge gap/space right after the text with a hyperlink and it brings any text after it to the next line. Can this be fixed?