How can I set the width of the Semantic UI Search Selection drop down? I need to set the width of Semantic UI Search selection dropdown to the longest element in the dropdown. Any help will be appreciated.
I used a fixed-size wrapper combined with a fluid (expands to fit size of parent) dropdown nested inside of it
<div style="width: 250px;">
<div class="ui fluid dropdown">
<input type="hidden" name="country">
<div class="default text">My Dropdown Text</div>
</div>
</div>
Try setting the min-width
instead of setting the width
. The default is a min-width
of 14em
, so you'll need to override that if you wish to have a smaller width.
Example:
.ui.dropdown.search{
min-width: /*smaller width here*/;
}
Try using the 'compact' attribute as shown below. However it only adjusts the width based on what is selected.
<div class="ui compact selection dropdown">
<i class="dropdown icon"></i>
<div class="text">Compact</div>
<div class="menu">
<div class="item">A</div>
<div class="item">B</div>
<div class="item">C</div>
</div>
</div>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.