Question

当我使用输入组时，每件事情都可以，但是当我使用input-group-lg时，Go按钮会转到下一行。

<div class="input-group-lg">
    <input type="text" class="form-control" placeholder="http://">
      <span class="input-group-btn">
      <button class="btn btn-default " type="button">Go!</button>
    </span>
</div>

我在pull-left中使用input解决了这个问题，但现在它在小分辨率下无法正确显示

Answer 1

input-group-lg是一个修饰符类，除了 input-group之外，还需要，而不是而不是 input-group。所以你的代码片段应该是：

<div class="input-group input-group-lg"> <input type="text" class="form-control" placeholder="http://"> <span class="input-group-btn"> <button class="btn btn-default " type="button">Go!</button> </span> </div>

Bootstrap的大多数类都遵循这种模式。

Answer 2

I have fixed this way:

I added "id=search_button" for my button

<div class="input-group input-group-lg">
<input type="text" class="form-control" placeholder="Username"/>
<span class="input-group-btn">
<button id="search_button" class="btn btn-primary" type="button">GO</button>
</span>
</div>

I apply this style to my button

#search_button {
    width: 90px;
    margin: 0 auto;
    text-align: justify;
}

That's all

bootstrap input-group-lg按钮输入问题

2 个答案: