Question

每当我使用select2时，空框只有一行高。添加输入后，框会相应地展开，但总是只需要确切的数量。

如何更改它以使我的输入框至少高100px，即使是空的？在某些情况下，我希望盒子在填充时可以达到100px甚至更高，所以在我的布局中看起来真的很笨，如果盒子首先只有16px高。

我应用select2（）的HTML元素是一个Select元素，其中＆＃34; multiple = multiple＆＃34; （我最终需要多个输入。）

我搜索了很多，也在这个论坛中搜索过，但到目前为止还没有任何工作。我尝试在我的自定义css文件中包含这样的内容：

.select2-container .select2-choice {
min-height:100px !important;
}

但它并没有改变任何事情。也许那些tipps适用于旧版本的select2？我使用的是4.0.0。

如何放大盒子？

解决方案：

我把它添加到我的CSS中。这一切都是为了让css选择器正确（最近确实似乎已经改变了）。我通过检查我的HTML输出来提取他们的名字。

.select2-container .select2-selection--multiple{
    min-height:100px;
    padding-bottom: 50px;
}

Answer 1

.select2-selection.select2-selection--multiple {
    min-height: 100px;
}

在examples page上进行了测试。

Answer 2

我会稍微填充select2选择容器，这样你仍然可以拥有动态高度，但要确保该元素永远不会与容器的底部接触。你也可以把min-height放在这里。

// Get foo number 42
fooHandler.getFoo(42, new GetFooCallback()
{
    @Override
    public void onResult(final Foo foo)
    {
        // Foo 42 retrieved, get a related Bar object
        barHandler.getBar(foo.getBarID(), new GetBarCallback()
        {
            @Override
            public void onResult(final Bar bar)
            {
                // Send a new Zorb(foo, bar) to server
                zorbHandler.sendZorbToServer(new Zorb(foo, bar), new ZorbResponseHandler()
                {
                    @Override
                    public void onSuccess()
                    {
                        // Keep dancing
                    }

                    @Override
                    public void onFailure()
                    {
                        // Drop the spoon
                    }
                });
            }
        });
    }
});

Select2 4.0.0 - 更改输入框高度

2 个答案: