Dashboards & Visualizations

Customize Dashboard Single Value (CSS)

kashz
Explorer

Hi, I'm looking to customize my dashboard.

I'm just wondering whether how is this dashboard built? (Extract from Splunk Security Essentials Addon, I really like how this row looks)
I understand that it has several <single> value searches within the same <panel> and <row>.

The second image is what I have currently:
But HOW to
1. Reduce the spacing between the title and the single-value ?
2. How to get the horizontal line separator?
3. How to reduce the width of the panels? (What is depends="$hideForCSS$") ?

alt text
alt text

0 Karma

Anam
Community Manager
Community Manager

Hi @kashz

Did the answer by @cmerriman help provide a working solution to your question? If yes, please don't forget to resolve this post by clicking "Accept". If no, please leave a comment with more feedback. Thanks!

0 Karma

cmerriman
Super Champion

The best thing i can recommend is using the Developer Tools in your browser to experiment with everything in the dashboard. That allows you to see what the elements are called and you can tweak some of the options and see the impact that they have by changing values around.

this website has some great references for CSS

to use CSS inline in your dashboard, follow this answers post

0 Karma
Get Updates on the Splunk Community!

Introducing the Splunk Community Dashboard Challenge!

Welcome to Splunk Community Dashboard Challenge! This is your chance to showcase your skills in creating ...

Built-in Service Level Objectives Management to Bridge the Gap Between Service & ...

Wednesday, May 29, 2024  |  11AM PST / 2PM ESTRegister now and join us to learn more about how you can ...

Get Your Exclusive Splunk Certified Cybersecurity Defense Engineer Certification at ...

We’re excited to announce a new Splunk certification exam being released at .conf24! If you’re headed to Vegas ...