Changing width kendo ui select dropdown?

Question

Kendo UI, have a great function for styling select control.

Like this simple:

Javascript

$(".form-group").find("select:not([multiple])").kendoDropDownList().end()

Html

<div class="form-group">
 <select id="language">
   <option selected>English</option>
   <option>German</option>
 </select>
</div>

It changes the look of select dropdown, but i got problem, it changes and select width to some crazy px width like 174px, but i want to have that value 100%, to parent element? Does anybody have soution for that?

Sorry I'm confused! You have a kendoDropDownList but you want to resize the width of the DDL to take the 100% width of the container, right?? — Mahib
.k-widget.k-dropdown { width:100%; } .k-widget.k-tabstrip > input.k-textbox { width:100%; } — Schneider

Dalorzo Dalorzo · Accepted Answer · 2014-01-26T21:37:22

Try adding this custom styling after the kendo ui css declaration:

CSS

span.k-dropdown {
   width: 100%;
}

Changing width kendo ui select dropdown?

1 Answers