选择框中的Scollbar没有出现

我试图制作一个下拉式滚动条。但事情并没有解决。选择框中的Scollbar没有出现

因此，这里的样机：

<div class="form-group"> 

    <div id="fixedHeightDropDownContainer"> 
     <label class="control-label">@Resources.IntrusionGroup</label> 
     <select name="intGroup1" id="intGroup1" class="form-control" tabindex="10" data-bind="options: $root.intGroups, optionsText: 'Name', optionsValue: 'Id',optionsCaption: '--Select--',value:$data.IntGroupName"></select> 
    </div> 
    <a href="#" class="ispicon ispicon_plus" data-toggle="modal" data-target="#addSchedule" data-bind="click:$parent.addGroup" title="Create New">Create New</a> 

</div>

现在我试着在CSS：

div#fixedHeightDropDownContainer { 
    height: 100px !important; 
    width:auto !important; 
    overflow-y:auto !important; 
    background-color:red; 
}

但没有奏效。我将样式应用于div，但保留了下拉选项。

然后我尝试：

#intrusionGroup1{ 
    height: 100px !important; 
    width:auto !important; 
    overflow-y:auto !important; 
    background-color:red; 
}

但也搞砸了UI。现在选择选项本身具有高度，而不是选项菜单。

怎样才可以解决吗？

谢谢。

来源

2016-09-29 StrugglingCoder

不可能扩大下拉。你必须做一些multiselect插件或为它编写jQuery代码。 –

看看这篇文章http://stackoverflow.com/questions/24119643/html-select-tag-show-verticle-scroll-with-10-option –

如果您正在寻找可滚动下拉菜单和选择框，您可以使用引导：有一个名为“可滚动菜单”的类。使用它，你会得到滚动菜单为您的下拉供参考： http://www.bootply.com/86116

来源

2016-09-29 11:01:09

'select-box'和'dropdown-菜单“，正确阅读问题 –

是的，但引导程序的”可滚动菜单“适用于选择框和下拉框，如果您知道引导程序 –

您必须在答案中提供一个示例。 –

为了设置选择框滚动您必须设置最大高度和overflow属性。请试试这个。

select#intGroup1 { 
    max-height: 100px; 
    overflow: scroll !important; 
}

我认为这将解决您的问题。

来源

2016-09-29 11:09:31 Nitheesh

你需要使用尺寸属性

<select size="5"> 
    <option value="1">Apple</option> 
    <option value="2">Banana</option> 
    <option value="3">Mango</option> 
    <option value="4">Grapes</option> 
    <option value="5">Olives</option> 
    <option value="6">Jalapeno</option> 
    <option value="7">Potato</option> 
    <option value="8">Tomato</option> 
    <option value="9">Garlic</option> 
    </select>

而且here工作示例

来源

2016-09-29 11:12:05

选择框中的Scollbar没有出现

回答

相关问题