Question

我有以下代码......

<div class="row">
  <div class="span6">
    <h2>Some Text</h2>
  </div>
  <div class="span6">
    <form class="form-inline pull-right">
      <input type="text" class="input-large">
      <button type="submit" class="btn">Search</button>
    </form>
  </div>
</div>

...但搜索表单与h2标签不对齐。我是否需要通过css自定义样式，或者我错过了一些默认的Bootstrap类来解决这个问题？

非常感谢您花时间阅读/回答此问题。

[编辑]

http://jsfiddle.net/nuB23/

添加了jsfiddle

Answer 1

删除表单上的pull-right类。另一个问题是h2有额外的填充并且是块级别。我认为你真正追求的是：

<div class="nav"> </div>

<div class="container">
    <form class="form-horizontal ">
        <div class="control-group  ">
            <label class="control-label large" for="searchInput">Label text:</label>
            <div class="controls search">
                <div class="input-prepend "> <span class="add-on"><i class="icon-search"></i></span>
                    <input type="text" id="searchInput"  />
                    <button type="submit" class="btn btn-primary">Search</button>
                </div>
            </div>
        </div>
    </form>
</div>

http://jsfiddle.net/dbrin/AV654/

Answer 2

尝试添加此样式：

[class*="span"], h2 {
    display: inline;
}

Updated Fiddle

如何使用bootstrap 2.3.2在span中水平居中形成？

2 个答案: