Dashboards & Visualizations

How to resize text in HTML dashboard

nikkkc
Path Finder

i try to resize some textinputs with css but it does not work as assumed.

this is my css:

input4{

width : 800px !important;
height :100px !important;
}

but the textinput is always the same size, just the next textinput 5 is moved into the right corner and to the bottom. it looks like the div size is changed but not the inputtext element??

0 Karma
1 Solution

rjthibod
Champion

Try adding this CSS.

.input-text > div > input[type=text] {
  width: 90% !important;
  max-width: 90% !important;
  min-width: 90% !important;
}

You are encountering an issue I have fought much and tried to find a generic workaround. Here is a little more explanation.

https://gist.github.com/thibodux/408a685dc1a46af5f4f73f7c2922e47e

View solution in original post

0 Karma

nikkkc
Path Finder

ok in general, this works but it is for every input field, this is not what i want

input
{ width:500px;}

0 Karma

rjthibod
Champion

Did you try what I suggested in my answer?

0 Karma

rjthibod
Champion

Try adding this CSS.

.input-text > div > input[type=text] {
  width: 90% !important;
  max-width: 90% !important;
  min-width: 90% !important;
}

You are encountering an issue I have fought much and tried to find a generic workaround. Here is a little more explanation.

https://gist.github.com/thibodux/408a685dc1a46af5f4f73f7c2922e47e

0 Karma

nikkkc
Path Finder

Ok wow, it seems this works, but does this also work for height? i would like to build a multiline text input

0 Karma

rjthibod
Champion

No clue. Try adding height setting to #input4 > div > input[type=text] to see.

0 Karma
Get Updates on the Splunk Community!

Building Reliable Asset and Identity Frameworks in Splunk ES

 Accurate asset and identity resolution is the backbone of security operations. Without it, alerts are ...

Cloud Monitoring Console - Unlocking Greater Visibility in SVC Usage Reporting

For Splunk Cloud customers, understanding and optimizing Splunk Virtual Compute (SVC) usage and resource ...

Automatic Discovery Part 3: Practical Use Cases

If you’ve enabled Automatic Discovery in your install of the Splunk Distribution of the OpenTelemetry ...