html - bootstrap输入框填不满col，只显示很短的一个

Question

我正在使用 bootstrop 绘制我的页面，代码如下。

<div class="row">
  <div class="col-lg-6">
    Test
  </div>
  <div class="col-lg-6">
    <div class="input-group">
        <input type="text" class="form-control" placeholder="Search for...">
    </div>
  </div>
</div>

我很好奇为什么输入框不能填满所有的'col-lg-6'而是有点短。

Here is the fiddle portal.

非常感谢!

Answer 1

问题是您的 col-lg-6类应用于外部 <div>而不是里面的。

试试这个:

<div class="row">
   <div class="col-lg-6">
    Test
  </div>
  <div>
    <div class="input-group; col-lg-6">
        <input type="text" class="form-control" placeholder="Search for...">
    </div>
  </div>
</div>

Bootply 结果 here .