Using chosen.js, how would I add images to the dropdown items?
The programmer can set this according to the need. Add <img> tag in dropdown content to insert image into dropdown list for each items. Note: In case the user needs the width of the content to be as wide as the dropdown button, please set the width to 100% (Set overflow: auto to get scroll on small screens).
To complete Joseph (I can't add comment to his answer), the class has changed since an unknown version: Here's the correct css in v1.0.0:
li.active-result {
background: url('path/to/img.png') no-repeat 3px center;
text-indent:2em;
}
Thx Joseph!
By setting a background-image
on chosen's list items:
.chzn-results li {
background: url('path/to/img.png') no-repeat 3px center;
padding-left: 12px;
}
Adjust the pixel count accordingly.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With