引导 前置和附加输入 如何最大输入字段宽度?
发布时间:2020-12-18 00:16:34 所属栏目:安全 来源:网络整理
导读:我正在使用Bootstrap从twitter。我想要的是制作一个前置文本,输入字段和一个按钮,但是我希望我的输入字段具有最大可用宽度,以便提交按钮的右边缘靠近该对象的右边缘。从引导文档中可以看出.input-block-level类允许任何或元素的行为类似于块级元素,但是
我正在使用Bootstrap从twitter。我想要的是制作一个前置文本,输入字段和一个按钮,但是我希望我的输入字段具有最大可用宽度,以便提交按钮的右边缘靠近该对象的右边缘。从引导文档中可以看出.input-block-level类允许任何或元素的行为类似于块级元素,但是将其应用到输入中会给出中心输入的大小。
http://jsfiddle.net/Uc4CE/
<div class="well"> <div class="input-prepend input-append"> <span class="add-on">Some text</span> <input class="input" type="text" name="xxx" value="xxx" /> <input type="hidden" name="next" value="xxx" /> <input type="submit" value="xx" class="btn btn-info" /> </div> </div> 解决方法
我正在寻找类似的东西,从
https://gist.github.com/mattjorn/5020957这个解决方案为我工作 – 将.input-block-level添加到你的外部div,
< div class =“input-prepend input-append input-block-level”> 然后扩展引导CSS,如下所示: .input-prepend.input-block-level { display: table; width: 100%; } .input-prepend.input-block-level .add-on { display: table-cell; background-color: white; } .input-prepend.input-block-level > input { box-sizing: border-box; height: 30px; display: table-cell; width: 100%; border-left-style: none; } (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |