boostrap的select2自动换行的问题解决
最近在使用boostrap的select2控件实现多选效果时发现一个问题
正常效果:
但是当选择了两个长一些的option时,发现select2莫名其妙的换了一行空白行:
经过F12调试发现是因为select2多选后有一个搜索功能,因为上一行剩余的控件不足以放下搜索框所以自然而然的换了一行 “空白行”:
知道问题出在哪个地方解决起来就很简单了,下面我提供了两种解决方案:
1.对于不需要搜索的情况下,直接使用CSS隐藏搜索框:
2.对于数据量较大,需要搜索,可以使用JS,在select2失去焦点后隐藏输入框,select2获取焦点后显示输入框,我这里没有搜索需求,就不贴代码出来了有需要的自行尝试。
boostrap的select2自动换行的问题解决的更多相关文章
- css实现强制不换行/自动换行/强制换行
在我们日常的编码中经常会遇到这段文字不可以换行,或者自动换行的需求.虽然这个功能在我们平时很常见但是我相信大家一定不会可以的去记住它吧(至少小月是很懒惰的从来是用什么查什么 ♦ 嘻嘻...).今天我们 ...
- CSS - 如何实现强制不换行、自动换行、强制换行 以及 chrom默认焦点 IE下 Input 默认出现叉
*:focus {outline: none;} input::-ms-clear {display:none;} 一般的文字截断(适用于内联与块): .text-overflow { display ...
- css样式自动换行/强制换行
写样式时遇到的英文字符超出容器问题,度娘后了解下列知识,与大家分享,同时以便自己日后回顾. 一.自动换行问题 正常字符的换行是比较合理的,而连续的数字和英文字符常常将容器撑大. 下面介绍的是CSS如何 ...
- css是如何实现在页面文字不换行、自动换行、强制换行的
强制不换行 div{ white-space:nowrap; } 自动换行 div{ word-wrap: break-word; word-break: normal; } 强制英文单词断行 div ...
- 解决boostrap中,iframe渲染下,苹果手机横向无法显示剩余内容问题
描述: 问题解决了,采用的手势拖动显示剩余内容,并不是有了横向滚动条 在head标签中加入 <head> <meta charset="utf-8"> &l ...
- css实现页面文字不换行、自动换行、强制换行
强制不换行 div{ white-space:nowrap; } 自动换行 div{ word-wrap: break-word; word-break: normal; } 强制英文单词断行 div ...
- 16/8/23_CSS自动换行
转载:http://blog.csdn.net/ye987987/article/details/8011875 自动换行问题,正常字符的换行是比较合理的,而连续的数字和英文字符常常将容器撑大,挺 ...
- mysql 7下载安装及问题解决
mysql 7安装及问题解决 一.mysql下载 下载地址:https://www.mysql.com/downloads/ Community (GPL) Downloads MySQL Commu ...
- 利用Select2优化@Html.ListBoxFor显示,学会用MultiSelectList
最近需要用到多选框,Asp.Net MVC自带的@Html.ListBox或@Html.ListBoxFor的显示效果太差,于是找到了Select2进行优化,并正式了解了多选框的操作方法. 首先介绍多 ...
随机推荐
- python31day
内容回顾 网编总结,思维导图 计划 并发编程的开始,计划6天 操作系统1天 进程2天 线程2天 携程1天 今日内容 操作系统 多道操作系统: 从顺序的一个个执行的思路变成:并行轮流使用cpu 一个程序 ...
- SpringMVC之RedirectAttributes属性
RedirectAttributes是SpringMVC3.1版本之后出来的一个新功能,专门用于重定向之后还能带参数跳转的的工具类. 两种带参方式: redirectAttributes.addAtt ...
- python 小兵 三元运算符
1 if 条件成立: 2 val = 1 3 else: 4 val = 2 改成三元运算: val = 1 if 条件成立 else 2 举例 条件成立走左边,条件成立走右边 a = 2 b = 5 ...
- IPsec协议簇简析
简介 IPsec协议簇是应用在网络层上的,来保护IP数据报的一组网络传输协议的集合.它是IETF(Internet Engineering Task Force)制定的一系列协议,它为IP数据报提供了 ...
- git命令log与reflog的比较
感谢原文作者:杨鲜生 原文链接:https://blog.csdn.net/u013252047/article/details/80230781 用git命令,想看到自己的操作记录,则可以使用log ...
- Mysql Json函数之搜索 (三)
本节中的函数对JSON值执行搜索操作,以从其中提取数据,报告数据是否在其中的某个位置或报告其中的数据的路径. JSON_CONTAINS(target, candidate[, path]) 通过返回 ...
- ubuntu中codeblocks设置代码黑色主题配色
说明 网上资料较杂乱,特整理以备留用和他人参阅. 配置文件下载 首先下载配置文件,命名为default.conf. 配置文件 官方配置文件网址 将配置文件替换ubuntu如下路径内的default.c ...
- Cadence物理库 LEF 文件语法学习【持续更新】
我是 雪天鱼,一名FPGA爱好者,研究方向是FPGA架构探索. 关注公众号,拉你进"IC设计交流群". @ 目录 一.LEF简介 1.1 通用规则 1.2 管理 LEF 文件 二. ...
- 【Gym100837F】Controlled Tournament(状压Dp 搜索剪枝)
题目链接 大意 现有\(N\)个人要打比赛,知道任意两个人间打比赛的胜负关系. 要求在 深度最小 的情况下,根为\(M\)的 竞赛树 的个数. 满足\(1\le M\le N\le 16\) 思路 虑 ...
- Note -「Min_25 筛」“你就说这素因子你要不要吧?你要不要?”
赛上想写,Track Lost 了属于是. \(\mathscr{Intro}\) Min_25 筛是用于求积性函数前缀和,同时顺带求出一些"有意思"的信息的筛法. 一 ...