CSS stylesheet code gets inserted into the text itself

  • Resolved tiotrom

    (@tiotrom)


    3 years, 4 months ago

    So over the past year or so I realized that random posts on my girlfriend’s blog have bits of CSS code inserted in random sentences. Like in the URL I provided. We used to fix these manually by removing them but for one this is not sustainable since months after we fix them, new such CSS bits appear. And second maybe it is an important Elementor bug that needs to be fixed.

    Search in the blog “For-profit? #000000;”>Yes” to see one example. The entire backend code in elementor for that bit is:

    <em><span style="color: #ff6600;">For-profit? </span></em><span style="color: #000000;">Yes, so they profit off of people who simply want to help each other out for free. I offer you a free place to sleep. You accept. We are kind and genuine. Couchsurfing International, Inc. figures out ways to profit off of this.</span><span style="color: #000000;">
</span>

    In Elementor that is rendered properly.

    But on the live page looks like this:

    I tried all I could, from tweaking the Elementor settings to minifying the CSS and so much more. If I disable the Elementor plugin the CSS snippets are not visible on the live page. So it seems to be an issue with how Elementor interprets these particular bits of code. It seems to be about the SPAN STYLE and related to color.

    I hope I can get some help with this.

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

Viewing 8 replies - 1 through 8 (of 8 total)
  • Elementor Team

    (@lianakap)

    3 years, 4 months ago

    Hi,

    I wasn’t able to relocate the issue.

    Were you able to solve the issue?

    Thread Starter tiotrom

    (@tiotrom)

    3 years, 4 months ago

    Hi. I had to fix it in the meantime, manually. Removing some styles. But here’s another example – https://www.bigworldsmallsasha.com/2018/11/26/days-2-3-hitching-to-moron/ at the bottom “#999999;”>(Photos by Felix)”. The HTML/CSS code is:

    <p class="font_8"><span style="color: #999999;">(Photos by Felix)</span></p>
    Elementor Team

    (@lianakap)

    3 years, 4 months ago

    Hi,

    We have inspected the source code of an affected page and noticed that CSS classes from HTML markup don’t match Elementor CSS classes: https://prnt.sc/xCaGs43ZHJvH

    This markup is most likely for WP Bakery and its widgets. We recommend that you check this issue with WP Bakery support.

    This is the problematic code: <span style=”color: <a rel=” tag”=”” class=”u-tag u-category” href=”https://www.bigworldsmallsasha.com/tag/999999/”>#999999;&#8221;>(Photos by Felix)</span>

    It gives multiple errors in the HTML validator: https://prnt.sc/dImZ1KrhihF_

    Please change/format differently if you want.
    I hope this helps.

    Thread Starter tiotrom

    (@tiotrom)

    3 years, 4 months ago

    I understand but the rest that had errors were made in Elementor. And it affects the WPBakery builder too.

    I made a post in Elementor with the above code only to show you the error – https://www.bigworldsmallsasha.com/2017/01/23/test-post/ – password is: testelementor.

    You can check now.

    Elementor Team

    (@lianakap)

    3 years, 4 months ago

    Hi,

    We checked the Text Editor on our local environment, which uses only The Elementor plugins, and the Text Editor widget is working fine: https://prnt.sc/LgdKtR5dwweQ

    After inspecting the new test page created with Elementor, we noticed some common issues for both WP Bakery and the Elementor page: https://prnt.sc/3zm4mtpPS4jl

    WP Bakery page is on the left, and the Elementor page is on the right:

    • On both sides, paragraph tags are getting font_8 CSS class. This class is not part of the Elementor naming system.
    • On both sides, the span tag is getting an anchor element with a link to tag on your page: https://www.bigworldsmallsasha.com/tag/999999/
    • The href attribute is not allowed inside the span tag, and you can also see some other formatting errors on the HTML validator: https://prnt.sc/fIDjF-qGW94v – The HTML parser breaks before #999999 and outputs the text after that.
    • On both sides, the a tag has u-tag and u-category CSS classes. These classes are not part of the Elementor naming system.

    Most likely, this is a third-party plugin issue. We advise the following steps:

    • Deactivate all your plugins except Elementor and test the preview.
    • Temporarily switch to a different theme. Try using a default WordPress theme like Twenty Twenty or Hello Elementor and test the preview.
    • Try to set different colors to the span element. Something that doesn’t match the name of your tags. It could be that some third-party plugin that uses these u- classes is injecting its formatting and causing the issue.
    Thread Starter tiotrom

    (@tiotrom)

    3 years, 4 months ago

    Ah thank you for all of these details. It was a plugin that grabbed hashtags and it conflicted with some CSS code. It was this https://ww.wp.xz.cn/plugins/activitypub/ – I will report it to the devs. Thanks for the input. You can close this issue.

    Matthias Pfefferle

    (@pfefferle)

    3 years, 4 months ago

    Hey @tiotrom the hashtag support of the ActivityPub plugin is beta state, I am sorry you had issues! Please deactivate that by unchecking the setting!

    Thread Starter tiotrom

    (@tiotrom)

    3 years, 4 months ago

    Perfect. That is a temporary fix. Cheers!

Viewing 8 replies - 1 through 8 (of 8 total)

The topic ‘CSS stylesheet code gets inserted into the text itself’ is closed to new replies.