Combobox component CSS

warning

The content on this page is outdated and will not receive updates. For the most up-to-date functionality, refer to Setting up and managing flows.

This topic provides examples of the main CSS classes/selectors you can use to customize combobox components.

Default player CSS

You can use the following main classes/selectors to apply additional CSS styling to combobox components in a flow running the default player.

Class/Selector	Description
.page-component-checkbox	The main class applied to the entire combobox component in a flow. For example, to increase the padding around all combobox components in a flow: .page-component-select {padding:15px}
.select-input	The main class applied to the input selection element. For example, to increase the padding around all input selection elements in a flow: .select-input {padding:15px}

Default legacy player CSS

You can use the following classes/selectors to apply additional CSS styling to combobox components in a flow running the default legacy player.

Combobox components use the React Selectize component, and are not able to be easily styled simply by targeting CSS classes/selectors.

However, if this is required, the .react-selectize stylesheet classes should be identified and targeted.

Class/Selector	Description
.mw-bs .mw-select	The main class applied to the entire combobox component within a flow. For example, to increase the padding around the combobox: .mw-bs .mw-select {padding:15px}