html - 覆盖父溢出 - 选择

Question

我正在为我的 select 使用插件html 元素，称为 http://wenzhixin.net.cn/p/multiple-select/

插件工作正常，但是在 overflow: hidden 中使用时我遇到了一些问题元素，因为它只显示部分 select选项值。

行为可以在这个 JSFiddle 中看到 当点击卖家时。

<div class="form">
    <div class="content form-horizontal">
        <div class="form-group">
            <label class="col-md-3">Name</label>
            <div class="col-md-7">
                <input type="text" class="form-control">
            </div>
        </div>
        <div class="form-group">
            <label class="col-md-3">Seller</label>
            <div class="col-md-7">
                <select id="multiple-select" multiple>
                    <option>John</option>
                    <option>David</option>
                    <option>Muller</option>
                    <option>Maria</option>
                    <option>Britney</option>
                    <option>Mario</option>
                    <option>Fellaini</option>
                    <option>Mark</option>
                </select>
            </div>
        </div>
    </div>
</div>

.form div 有 css:

.form
{
  overflow: hidden;
  background-color: #fff;
  padding: 15px;
}

如何解决此问题以查看所有元素？

Answer 1

试试这个。将此 css width:100%!important; 添加到 .ms-parent 类，因为它采用了内联 css，因此覆盖它并删除 overflow:hidden css 到 .form 类。

我已经更新了 fiddle https://jsfiddle.net/58zg3268/2/

.ms-parent {    
    width:100%!important;
}