Dashboards & Visualizations

How to make a drop-down form wider?

johnraftery
Communicator

Hi,

I have a very simple UI question 🙂

The default width of drop-down boxes is too short to display enough information in my use case. Can it be extended?

Thanks,
John

0 Karma

Yunagi
Communicator
0 Karma

johnraftery
Communicator

I tried the CSS solution described here;
https://answers.splunk.com/answers/295879/how-can-i-extend-the-width-of-my-drop-down-box-in.html

But instead of making the inputbox wider, it shifted the rest of the row further to the right giving 500px of space. Is this the correct CSS?
#resized_input {
width: 500px;
}

0 Karma

markthompson
Builder

Hi there - that CSS is fine given that you have applied the ID to the tag. If you have it anywhere else, then it would push it.

johnraftery
Communicator

I've applied the ID like this:

      <input type="dropdown" token="tps_logger_method" searchWhenChanged="true" id="resized_input">
        <label>Select a logger name</label>
        <search>
          <query>eventtype=mlc2 sourcetype=tps host=$host_token$ | table name | dedup name | sort name</query>
          <earliest>$time_token.earliest$</earliest>
          <latest>$time_token.latest$</latest>
        </search>
        <fieldForLabel>name</fieldForLabel>
        <fieldForValue>name</fieldForValue>
        <default>murex.limits.engine.stream.histo.TPSHistoCounter</default>
      </input>

And the stylesheet is referenced in the form tag like this:

<form script="table_cell_highlighting.js,simple_xml_examples:tokenlinks.js" stylesheet="table_cell_highlighting.css,single_decorations.css">

But it's still not working I'm afraid.

0 Karma

johnraftery
Communicator

Do I need to restart splunk after updating the CSS?

0 Karma

johnraftery
Communicator

Thanks. I've had a look at these and they are probably what I need, but I don't understand how to convert the dashboard to HTML and then override the CSS. What exactly do I need to do?

0 Karma
Get Updates on the Splunk Community!

More Control Over Your Monitoring Costs with Archived Metrics!

What if there was a way you could keep all the metrics data you need while saving on storage costs?This is now ...

New in Observability Cloud - Explicit Bucket Histograms

Splunk introduces native support for histograms as a metric data type within Observability Cloud with Explicit ...

Updated Team Landing Page in Splunk Observability

We’re making some changes to the team landing page in Splunk Observability, based on your feedback. The ...