topic Re: Why doesn't CSS work in dashboards? in Dashboards & Visualizations

Why doesn't CSS work in dashboards?

rendie — Tue, 10 Dec 2019 14:38:49 GMT

Hi,
I use this example in my dashboard on local splunk this work:

But if I use this example in Splunk on Google Cloud Platform, then css doesn't work.
How to fix it?

Re: Why doesn't CSS work in dashboards?

kamlesh_vaghela — Wed, 11 Dec 2019 05:18:19 GMT

@rendie
Any error you seen in browser console? Can you please share more information like Splunk Version in local and cloud?

Re: Why doesn't CSS work in dashboards?

rendie — Wed, 11 Dec 2019 08:24:35 GMT

@kamlesh_vaghela No error. Splunk Local is 7.3.1.1, Splunk on Cloud 7.3.3

Re: Why doesn't CSS work in dashboards?

anthonymelita — Fri, 13 Dec 2019 22:08:48 GMT

I'm just discovering the same issue today an found in the release notes that Splunk broke CSS in 7.3.3. This also breaks in-line CSS which I have yet to figure out how to fix.

Uncategorized issues
Date filed  Issue number    Description
2019-12-03  SPL-180371, SPL-175319  CSS outside of <html> tag in SimpleXML doesn't work

Workaround:
Add <style> tag inside of <html> tag, with <p /> in front of the style tag:
<dashboard>
    <label>built-in css</label>
    <row>    
        <panel>      
            <html>
                <p/>
                <style>#text {background: red;}</style>        
                <div id="text">text with red background</div>
            </html>    
        </panel> 
    </row>
</dashboard>