Text decoration no longer applied to In post links

Question

First, I am new to having a website and far from an expert though I am trying to learn every day.

I am struggling with the in-text links I have in my posts, they no longer have any text decoration. They were set to a different text color (a brownish color) and I believe at one point underlined.

Now the in-text links look the same as all other text in the post.

The theme I use has Kadence blocks for editing.

I have attempted changing the text link decoration through Kadence but it doesn't change in post links (only homepage or header links). I have cleared the cache on my computer and my website. Through research, I tried adding an Additional CSS code into the Kadence style editor using the following:

.post a {

text-decoration: underline!important;

}

I have resorted to manually changing each and every link in some posts, but I don't want to have to do that for each and every post.

Website: https://rejoiceabout.com/

Example post that has in-text links with no decoration: https://rejoiceabout.com/how-to-make-diy-wooden-house-number-sign/

Is there something I am missing? Again, not super knowledgeable about backend/coding but willing to try with some guidance!

If there is a simple approach I would also love to hear it. Thank you!

Answer 1

Using !important is generally not recommended, as it leads to problems like this where styles can't be overridden and a site becomes an unmaintainable mess. Your stylesheets are absolutely littered with !important: I count 909 instances. Instead of using !important you should override styles by supplying a rule that's more specific.

You can find out where the offending style is by disabling your cache then inspecting a link using your browser's dev tools, it will tell you which file and which line to look for.

As you can see, the line number on the right refers to line number in the cache. With the cache disabled, that line number will point you to the original file and line so you can edit it.