Bootstrap，多字段搜索栏

Question

我正在为新网站设计一个多字段搜索栏。该网站是用PHP / Javascript / Bootstrap

制作的

我需要创建4个字段（3个文本字段+ 1个搜索按钮），它们应该在

中对齐

<div class="row">
   <div class="col-lg-8 col-lg-offset-2">
       ..here the fields plus button...
   </div>
</div>

我该怎么做？我尝试使用form-inline，但这是结果：

Answer 1

如果您没有像旧浏览器支持这样的特殊问题，那么您可以享受Flex的乐趣。

https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Answer 2

你必须分发到12个cols并将你的div居中，如：

更改您的代码：

<div class="row">
   <div class="col-lg-8 col-lg-offset-2">
       ..here the fields plus button...
   </div>
</div>

对于：

<!--Adding some styles for center the row-->
<div class="row" style="margin: 0 auto; display:block; width: 100%;">
    <div class="col-lg-2">Field One</div>
    <div class="col-lg-2">Field Two</div>
    <div class="col-lg-2">Field Tree</div>
    <div class="col-lg-6">Your search field</div>
</div>

请参阅以下内容：http://getbootstrap.com/css/#grid了解更多信息。