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!

Splunk Observability Cloud’s AI Assistant in Action Series: Analyzing and ...

This is the second post in our Splunk Observability Cloud’s AI Assistant in Action series, in which we look at ...

Elevate Your Organization with Splunk’s Next Platform Evolution

 Thursday, July 10, 2025  |  11AM PDT / 2PM EDT Whether you're managing complex deployments or looking to ...

Splunk Answers Content Calendar, June Edition

Get ready for this week’s post dedicated to Splunk Dashboards! We're celebrating the power of community by ...