This is a migrated thread and some comments may be shown as answers.

Change the image on the Dropdownlist

2 Answers 332 Views
DropDownList
This is a migrated thread and some comments may be shown as answers.
Bryan Smouse
Top achievements
Rank 1
Bryan Smouse asked on 09 Feb 2017, 04:47 PM

Hello all,

I am looking for the css class that I can use to override the "v" icon that is shown to the right of a Kendo DropDownList.  If I can't replace the icon itself, I'll settle for changing the color of it. 

 

For what it's worth, here's my dropdownlist:

var facilityList = Html.Kendo().DropDownList()
.Name("facilityList")
.HtmlAttributes(new { style = "width: 200px;" })
.Items(items =>
{
foreach (var item in Model.Facilities.Values)
{
items.Add().Text(item.Name).Value(item.Id.ToString());
}
});

 

 

2 Answers, 1 is accepted

Sort by
0
Bryan Smouse
Top achievements
Rank 1
answered on 09 Feb 2017, 04:55 PM

I forgot to mention that I would also like to override the shadow style that shows on hover over the DropDownList. 

I have included an image to clarify (That is a Kendo UI dropdownlist, but with lots of css styling).

0
Ivan Danchev
Telerik team
answered on 10 Feb 2017, 08:14 AM
Hello Bryan,

Here's a sample dojo, which demonstrates how the DropDownList arrow icon can be changed, by default the pseudo element's content property value is "\e006" and in the example the arrow is changed to a plus sign ("\e120"). The second CSS rule shows how the color of the icon can be customized. The first rule shows how the border and the background of the widget can be set for its hover state.

Regards,
Ivan Danchev
Telerik by Progress
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
DropDownList
Asked by
Bryan Smouse
Top achievements
Rank 1
Answers by
Bryan Smouse
Top achievements
Rank 1
Ivan Danchev
Telerik team
Share this question
or