(The following results I extracted using the Firefox Inspector)
The specific example you called out does not have any selector that would be make it underlined. Only selectors that make it specifically not underlined:
a {
text-decoration: none;
}
.elementor a {
text-decoration: none;
}
Other anchors(links) do have a rule for making it underlined but that is being overwritten. Take the comment area for example:
.comments-area a {
text-decoration: underline;
}
.elementor a {
text-decoration: none;
}
The .elementor a
selector overwrites the .comments-area a
not because of specificity but because of the order of appearance meaning .elementor a
is added upon .comments-area a
.
Reading your post it would suggest it has worked in the past so I think the problem is that somehow the order of enqueuing (of the stylesheets(css)) has been changed. Maybe you know something about this?
I don’t have any experience with Elementor but I would advise you to do one of these if possible:
- Change the order of enqueueing (of the stylesheets)
- Add custom css: this is probably possible in Elementor. write something with higher specificity like:
html .elementor a { text-decoration: underline; }
. Note that this specific example would select more anchors than you probably want. Contact me if you need some help with a specific use case. - Change the styles with elementor using the gui? Again I don’t have any experience with Elementor.
- Change the theme stylesheet to have higher specificity on those specific selectors that you want underlined.
Hope this helped!