Css 设置Twitter引导搜索表单的样式

我正在尝试使用引导构建一个搜索表单。以下是HTML：

<form class="form-search search-bar">
  <div class="input-append">
    <input type="text" class="search-query" placeholder="Enter your address here...">
    <button type="submit" class="btn btn-primary">
    Search <i class="icon-search icon-white"></i></button>
  </div>
</form>

搜寻

---

我是CSS新手-如何设置样式以使搜索元素在块上水平居中？另外，如何增加搜索元素的高度？

要将它们相邻放置，可以使用float命令

.search-query {
  float:left;
}
.btn-primary {
  float:left;
}

确保

input append

的宽度足够大，可以将它们相邻放置

要增加那里的高度，只需放置高度：[amount]；在与CSS中的

float

相同的块中，您应该添加一个ID

.search-bar {
    text-align: center; /* centers inline and inline-block children */
}
.search-bar .search-query,
.search-bar .btn-primary {
    display: inline-block; /* allows for heights to be set */
}
.search-bar .search-query {
    height: 30px;
}
.search-bar .btn-primary {
    height: 40px;
}

---

他们已经在线了。。。浮动没有任何作用。您还可以让它们

display:inline block

文本对齐不会使搜索表单在页面上居中。有什么想法吗？啊，我想出来了。您需要将文本对齐：居中一级以上设置为.search bar，而不是.input append。必须是由于在“input append”上设置了样式，因为它是一个引导类。你能修改答案让我接受吗？谢谢，我假设文本对齐只处理文本对齐，所以我没有使用它。是的，如果你把它放在任何一个家长身上，它都可以工作。编辑<代码>文本对齐：居中适用于任何

内联

或

内联块

。