CSS linear-gradient getting removed

Nisala Kalupahana
I'm New Here
I'm New Here
Those new to the Atlassian Community have posted less than three times. Give them a warm welcome!
July 19, 2021

For some reason, Confluence isn't letting me add a linear-gradient background CSS.

Steps to reproduce:

  • Create a Confluence page
  • Edit the page, go to the Source Editor, and enter "<div style="width: 100.0px;height: 100.0px; background: linear-gradient(90deg, rgba(17,199,208,1) 0%, rgba(17,199,208,1) 11%, rgba(255,255,255,1) 11%, rgba(255,255,255,1) 100%);">Test</div>"
  • Click Apply, and the gradient will appear in the preview window.
  • If you now Save, Preview, or re-open the Source Editor, the CSS for the linear-gradient will be gone. It just completely disappears, and seems to be replaced with "<div style="width: 100.0px;height: 100.0px;">Test</div>".

Any guidance on what's going on here would be greatly appreciated -- I have no idea what's going on. 

1 answer

0 votes
Brant Schroeder
Community Leader
Community Leader
Community Leaders are connectors, ambassadors, and mentors. On the online community, they serve as thought leaders, product experts, and moderators.
August 3, 2021

@Nisala Kalupahana Welcome to the Atlassian Community

I would suggest adding class to the page <div class="gradient"</div>  Confluence will remove certain reserve characters.  Then add your styles to the global stylesheet or custom html in general configuration.

Suggest an answer

Log in or Sign up to answer
TAGS
AUG Leaders

Atlassian Community Events