New to Kendo UI for Angular? Start a free 30-day trial
Setting the Width
The Input components have different default width
, depending on their rendering and purpose.
Some Inputs (like the Switch or ColorPicker) have specific width
applied out of the box, as this is essential for UX consistency and proper component functionality. Other Input components (like the NumericTextBox or TextArea), have a default width
of 100%
, thus their sizing is left for the developer to handle per case.
The following list outlines the default widths of the Inputs:
- Inputs with specific default width—
Checkbox
,ColorGradient
,ColorPalette
,ColorPicker
,FlatColorPicker
,RangeSlider
,Slider
,Switch
. - Inputs with a default width of
100%
—MaskedTextBox
,NumericTextBox
,TextArea
,TextBox
.
All Inputs allow you to customize their width via CSS. To achieve this, utilize the width
CSS property.
The following example demonstrates how to specify the width of the Inputs.
Change Theme
Theme
Loading ...