html – twitter bootstrap input-group-addon和btn-group没有很好地对齐

概述我有一个选择项目,我已经从 http://silviomoreto.github.io/bootstrap-select/开始应用selectpicker功能 现在我正在尝试将输入组插件与选择对齐,后者变为btn组, 然而,插件的高度永远不会与btn-group的高度相同,我使用的是twitter bootstrap 3. 任何可以告诉我如何做到这一点的人,我的代码是： <div class="i 我有一个选择项目,我已经从 http://silviomoreto.github.io/bootstrap-select/开始应用selectpicker功能
现在我正在尝试将输入组插件与选择对齐,后者变为btn组,
然而,插件的高度永远不会与btn-group的高度相同,我使用的是twitter bootstrap 3.
任何可以告诉我如何做到这一点的人,我的代码是：

<div >    <span ID="contact_servicecode" >CONTACT_SERVICECODE</span>    <div >        <button  data-toggle="dropdown" type="button">            <div >1</div>            <div ></div>        </button>        <div >            <ul  role="menu">        </div>        <select  >            <option value="1">1</option>            <option value="2">2</option>        </select>    </div></div>

解决方法 这是我的Jsbin,我是如何解决它的. jsbin

当您将输入组大小设置为“input-group-lg”或“input-group-sm”时,它将为您提供预定义的大小 – 最明显的是输入的高度分别为46px或30px.但是,如果您接受常规尺寸,则无任何反应.我想如果您对bootstrap之外的输入进行设置,那么您就不会感到惊讶.

以下是lg的示例测量

.input-group-lg > .input-group-btn > .btn {    height: 46px;    padding: 10px 16px;    Font-size: 18px;    line-height: 1.33;    border-radius: 6px;}

事实上,我没有调整lg,而是创建了一个名为’input-group-reg’的类,它使用的测量值是bootstrap给出的’lg’和’sm’之间的中间点.

.input-group-reg > .form-control {    height: 38px;    padding: 8px 13px;    Font-size: 14px;    line-height: 1.44;    border-radius: 6px;  }/* Sizing the input */.default-input-group-lg > form-control {    height: 38px;    padding: 8px 13px;    Font-size: 14px;    line-height: 1.44;    border-radius: 6px;  }/* Sizing the button */.input-group-reg > .input-group-btn > .btn,.input-group-reg > .input-group-btn:last-child > .dropdown-toggle{    height: 38px;    padding: 8px 13px;    Font-size: 14px;    line-height: 1.44;    border-radius: 6px;}

总结

以上是内存溢出为你收集整理的html – twitter bootstrap input-group-addon和btn-group没有很好地对齐全部内容，希望文章能够帮你解决html – twitter bootstrap input-group-addon和btn-group没有很好地对齐所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。