bootstrap .input-append trouble

kda*_*avh 5 twitter-bootstrap

我正在尝试使用twitter bootstrap对我的布局进行一些简单的调整,但是使用'input-append'类是困扰我的.我确定答案非常简单,但我是新手,而且我一直在花费太长时间试图找到答案.

我希望文本输入,按钮和结束文本div在同一行,我希望该按钮附加到文本输入.

这是我的jsfiddle:http://jsfiddle.net/kdavh/azF8w/2/

...专注于按钮周围的div:

<div class='span2'>
  <input class="btn btn-primary span2" type="submit" value="Search" />
</div>
Run Code Online (Sandbox Code Playgroud)

如果我改成它

<div class='span2 input-append'> ...
Run Code Online (Sandbox Code Playgroud)

该按钮采用正确的形状,但与文本输入分开

如果我取下span2并将其更改为

<div class='input-append'> ...
Run Code Online (Sandbox Code Playgroud)

然后正确添加按钮,但随后将"结束文本"块推送到下一行.

我会饶恕你所尝试过的所有其他排列.我搜索过但找不到一个有效的例子.

有人可以帮忙吗?

小智 2

请尝试下面的代码:

<div class='container'>
    <div class='row'>
        <form>
        <div class='span3 input-append'>
            <input class="span2" id="main_search" type="text" />
            <input class="btn btn-primary" type="button" value="Search" />
        </div>
        <div class='span2'>
            <a class='littleNote' href=''>End Text</a>
        </div>
        </form>
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)