[Resolved] CSS classes not updating when using Beaver Builder to create a template

[Author]

Posts

[adamR-11]

I am trying to:

Redesign my single posts with Toolset, instead of Beaver Themer.

I created a Toolset Content Template with Beaver Builder, and assigned a CSS class to the main content in the post. But the CSS is not being applied.

Link to a page where the issue can be seen:

hidden link

User name: lawoffice
Password: lawoffice

I expected to see:

The links in the article would appear underlined, like in this post: hidden link

Instead, I got:

The links in the article are not underlined.

[Shane Supporter Languages: English (English ) Timezone: America/Jamaica (GMT-05:00)]

Hi Adam,

Thank you for contacting our support forum.

Could try using !important on your css class and see it this works?

Thanks,
Shane

[adamR-11]

Thanks. I tried adding !important, it doesn't help. 🙁

[Shane Supporter Languages: English (English ) Timezone: America/Jamaica (GMT-05:00)]

Hi Adam,

Mind providing admin access so that I can check this one out for you ?

The private fields have been enabled for your next response.

Thanks,
Shane

[Shane Supporter Languages: English (English ) Timezone: America/Jamaica (GMT-05:00)]

Hi Adam,

You can try using this css.

.ltr a{
    background-image: linear-gradient(#fff 82%, #4d86ae 50%);
    background-repeat: repeat-x;
    font-size: 1em;
    color: #000000;
}

This should work.
Thanks,
Shane

[adamR-11]

Thanks.

I added that code to my style.css

I flushed the site cache, the Beaver Builder cache, the WPML cache, and I force-refreshed the page in Chrome, still the change did not show up.

Are you sure I should use the class ".ltr"?

Please let me know what can be done, thanks.

[Christian Cox]

Hi, Shane is out on holiday this week so I'm looking over his tickets. It looks like the "ltr" isn't a class at all, so .ltr isn't right. I believe the following code will fix the problem:

.fl-post .fl-post-content a {
    background-image: linear-gradient(#fff 82%, #4d86ae 50%);
    background-repeat: repeat-x;
    font-size: 1em;
    color: #000000;
}

.fl-post .fl-post-content a:hover {
    background-image: linear-gradient(#fff 82%, #ccdce8 50%);
    text-decoration: none;
}

[adamR-11]

Hi, my css fix is working now - dunno why it wasn't working before. Thanks.