form-control 总是会换行,后面加单位的时候很难看,如下图。

 <div class="col-sm-3">
<input id="investAmount" name="investAmount" class="form-control" required th:field="*{investAmount}" type="text">
<select name="unit" class="form-control" th:field="*{unit}" id="unit" >
<option value="万元">万元</option>
<option value="亿元">亿元</option>
</select>
</div>

尝试了多种方法,终于发现 在外框里加入 form-inline就可完美解决。

1 <div class="form-inline col-sm-3">
2 <input id="investAmount" name="investAmount" class="form-control" required th:field="*{investAmount}" type="text">
3 <select name="unit" class="form-control" th:field="*{unit}" id="unit" >
4 <option value="万元">万元</option>
5 <option value="亿元">亿元</option>
6 </select>
7 </div>

前端.解决form-contral总是换行问题的更多相关文章

  1. Web前端设计:Html强制不换行<nobr>标签用法代码示例

    在网页排版布局中比如文章列表标题排版,无论多少文字均不希望换行显示,需要强制在一行显示完内容.这就可以nobr标签来实现.它起到的作用与word-break:keep-all 是一样的.nobr 是 ...

  2. web添加第三方应用,前端解决跨域问题的8种方案

    应用场景 web应用通过QQ登录授权实现第三方登录. 操作步骤 1. 注册成为QQ互联平台开发者,http://connect.qq.com/ 2. 准备一个可访问的域名,如dev.foo.com 3 ...

  3. [转] js前端解决跨域问题的8种方案(最新最全)

    1.同源策略如下: URL 说明 是否允许通信 http://www.a.com/a.jshttp://www.a.com/b.js 同一域名下 允许 http://www.a.com/lab/a.j ...

  4. 一段神奇的代码,解决form表单背景偏黄问题

    一段神奇的代码,解决form表框背景偏黄问题 最近在做项目时,发现自己做的挺好看的表单,背景变成了黄色,所以这次折腾了好久终于找到了符合我的决绝办法,现在来分享给大家 一般解决这种input表框偏黄问 ...

  5. Python web前端 11 form 和 ajax

    Python web前端 11 form 和 ajax 一.打开服务器 将handlers.py.httpd.py和libs.py三个文件放入新文件夹中,双击打开httpd.py文件即可 二.ajax ...

  6. Golang Web开发时前端出现谜之空白换行的坑

    在使用Golang做Web开发时,有时候渲染出来的模板在前台显示时会出现一些奇怪的空白换行,具体特征就是查看css样式表并没有相关定义的空白部分. 分析: 查看出现问题页面的网页源代码,复制空白换行部 ...

  7. 解决ReSharper自动删除换行

    使用Devexpress+ReSharper进行开发,似乎是C/S开发的最佳搭配. 但在ReSharper使用时,发现一个非常烦人的问题:即按F5进行调试时,自动删除换行,这样不仅把代码搞乱了,而且有 ...

  8. 微信授权、获取用户openid-纯前端实现——jsonp跨域访问返回json数据会报错的纯前端解决办法

    近来,倒霉的后台跟我说让我拿个openid做微信支付使用,寻思很简单,开始干活. 首先引导用户打开如下链接,只需要将appid修改为自己的就可以,redirect_url写你的重定向url https ...

  9. 使用注释来解决关于inline-block元素换行问题

    昨天群里有人问个问题:为什么button加了文字后,产生了对齐不一致的问题. 原因在于baseline的对齐问题. 然后就有人推荐了一篇文章:关于Vertical-Align你需要知道的事情 其中里面 ...

随机推荐

  1. 几种常见排序算法的基本介绍,性能分析,和c语言实现

    本文介绍6种常见的排序算法,以及他们的原理,性能分析和c语言实现: 为了能够条理清楚,本文所有的算法和解释全部按照升序排序进行 首先准备一个元素无序的数组arr[],数组的长度为length,一个交换 ...

  2. 2018-5-19-创建不带BOM-的UTF8

    title author date CreateTime categories 创建不带BOM 的UTF8 lindexi 2018-05-19 14:11:33 +0800 2018-2-13 17 ...

  3. Linux 内核提交 urb

    一旦 urb 被正确地创建,并且被 USB 驱动初始化, 它已准备好被提交给 USB 核心来发送 出到 USB 设备. 这通过调用函数 usb_submit_urb 实现: int usb_submi ...

  4. 【hdu 1849】Rabbit and Grass

    Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Total Submission(s) ...

  5. CDM命令实现MySql数据库文件的导出导入

    1.首先进入MySQL的安装目录,找到Bin文件夹,我这里安装的目录是C:\Program Files\MySQL\MySQL Server 8.0\bin ,进入该文件夹后在空白处按下Shift键+ ...

  6. 【Linux】查看系统资源及相关信息

    查看系统信息: uname -a # 查看Linux内核版本信息 cat /proc/version # 查看内核版本 cat /etc/issue # 查看系统版本 lsb_release -a # ...

  7. Kubernetes Clusters

    1. 创建集群 Kubernetes集群  Kubernetes协调一个高可用的计算机集群,作为一个单独的单元来一起工作.有了这种抽象,在Kubernetes中你就可以将容器化的应用程序部署到集群中, ...

  8. com.mysql.jdbc.PacketTooBigException: Packet for query is too large (1680 > 1024). You can change this value on the server by setting the max_allowed_packet' variable.

    这个错误是由于mysql的一个系统参数max_allowed_packet设置的值过小引起的 解决这个错误的方法就是修改这个参数的值, linux系统中我们在etc目录下找到my.cnf这个文件,打开 ...

  9. 20191024-2 Alpha阶段贡献分配

    此作要求参见: https://edu.cnblogs.com/campus/nenu/2019fall/homework/9858 要求1 每位组员的贡献分值 罗杨美慧:9 徐丽君:11 魏鑫:12 ...

  10. 图解leetcode279 —— 完全平方数

    每道题附带动态示意图,提供java.python两种语言答案,力求提供leetcode最优解. 描述: 给定正整数 n,找到若干个完全平方数(比如 1, 4, 9, 16, ...)使得它们的和等于  ...