Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Splunk CSS to simplify resizing SimpleXML form inputs
/* Splunk's SimpleXML classes for text boxes, drop downs, and
multiselect inputs have some odd CSS settings that make
it difficult to change the width of the whole entity with
a single CSS setting.
The following adjustments to the child input elements
are intended to overcome this challenge by making the
internal elements conform to the width setting of the
top-level container.
Using these settings for an entire app will allow a developer
to resize these type of inputs by simple adjusting the
`width` CSS setting for the top-level class or HTML ID */
/* internal piece of text inputs */
.input-text > div input[type=text] {
width: 90% !important;
max-width: 90% !important;
min-width: 90% !important;
}
/* internal piece of dropdown inputs */
.input-dropdown > .splunk-dropdown > div {
width: 100% !important;
max-width: 100% !important;
min-width: 100% !important;
}
/* internal piece of multiselect inputs */
.input-multiselect > div > div {
width: 100% !important;
max-width: 100% !important;
min-width: 100% !important;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.