JavaScript UI Libraries & Blazor Components Suite – Smart UI › Forums › DropDownList › DropdownList with images › Reply To: DropdownList with images
July 29, 2021 at 1:46 pm
#102109
YavorDashev
Member
Hi tullio0106,
I have created a quick code example that showcases you how to achieve the functionality you need.
In your html file:
<smart-drop-down-list drop-down-open-mode='dropDownButton' display-member="value" drop-down-height='800' drop-down-width='800'>
<smart-list-item value="first image">
<img src="path to your image" alt="">
</smart-list-item>
<smart-list-item value="second image">
<img src="path to your image" alt="">
</smart-list-item>
</smart-drop-down-list>
And also some necessary CSS:
smart-drop-down-list{
min-height: 35px;
height: auto;
}
.smart-list-item-container img {
width: 100%;
height: 100%;
}
smart-list-item .smart-content,
smart-list-item .smart-overlay,
smart-list-item,
smart-drop-down-list {
height: 300px;
}
Let me know if that works for you!
Please, do not hesitate to contact us if you have any additional questions.
Best regards,
Yavor Dashev
Smart UI Team
https://www.htmlelements.com/