Css 引导搜索按钮与输入字段不一致

ı我正在尝试在的就绪模板上创建一个更改搜索部分

因此，我得到的这张图片，你可以看到searchnow不在同一行。

在这里你可以看到代码，我有那部分

<section id="search_container">
<div id="search">
                <ul class="nav nav-tabs">
                    <li class="active"><a href="#tours" data-toggle="tab">Tours</a></li>

                </ul>

                <div class="tab-content">
                    <div class="tab-pane active" id="tours">
                    <h3>Search Tours in Paris</h3>

                        <div class="row">
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label>Destination</label>
                                    <input type="text" class="form-control" id="firstname_booking" name="firstname_booking" placeholder="Type your search terms">
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                     <label><i class="icon-calendar-7"></i> Date</label>
                                    <input class="date-pick form-control" data-date-format="M d, D" type="text">

                                </div>

                            </div>

                            <button class="btn_1 green" type="submit"><i class="icon-search"></i>Search now</button>


                        </div><!-- End row -->



                    </div><!-- End rab -->


                </div>
</div>

巴黎搜寻之旅
目的地
日期
现在搜索

如何将此搜索框放在同一行中

谢谢。

问题很简单：
您在其余部分提供了标签和输入，而在本部分中仅提供了一个输入，因此输入占据了标签的位置。
除了加宽整个div并将整行内联外，没有什么好的解决方案。
另一种方法是创建一个标签或一个cssed空div来按下按钮。
或者您可以使用“top”和“position”属性为按钮添加内联样式。
我还建议为此使用一个列。这样会更干净。

问题很简单：
您在其余部分提供了标签和输入，而在本部分中仅提供了一个输入，因此输入占据了标签的位置。
除了加宽整个div并将整行内联外，没有什么好的解决方案。
另一种方法是创建一个标签或一个cssed空div来按下按钮。
或者您可以使用“top”和“position”属性为按钮添加内联样式。
我还建议为此使用一个列。这样会更干净。

[update]

在您的标签css中，我看到它向

添加了另一个5 px的底部边距，因此对于hack解决方案，我添加了一个带有另一个5 px底部边距的br以获得结果

    <div class="col-md-5">
        <div style="margin-bottom: 5px;">
            <br>
        </div>
        <button class="btn_1 green" type="submit"><i class="icon-search"></i>Search now</button>
    </div>

现在搜索

[更新]

在您的标签css中，我看到它向

添加了另一个5 px的底部边距，因此对于hack解决方案，我添加了一个带有另一个5 px底部边距的br以获得结果

    <div class="col-md-5">
        <div style="margin-bottom: 5px;">
            <br>
        </div>
        <button class="btn_1 green" type="submit"><i class="icon-search"></i>Search now</button>
    </div>

现在搜索

试试这个，这就是你的意思吗？如果有帮助，请告诉我。我试过创建一个专栏，但结果是一样的。你试过小提琴吗？您可以在这里看到，您实际上可以构建另一行，但在移动设备上，您希望如何构建它？如果您关闭响应，只使用dekstop，那么请使用其他行。试试这个，这是您的意思吗？如果有帮助，请告诉我。我试过创建一个专栏，但结果是一样的。你试过小提琴吗？您可以在这里看到，您实际上可以构建另一行，但在移动设备上，您希望如何构建它？如果您关闭响应，只使用dekstop，则使用不同的行。我添加了“立即搜索”，但sameI也没有提到top和position属性…我选中了…set位置：相对位置和顶部：27px…我添加了“立即搜索”，但不可能是sameI也提到了顶部和位置属性…我检查了…设置位置：相对位置和顶部：27px…我想你的css已经被编辑太多了，你能像我的更新一样手动使用bootsrap吗？我试了很多次。谢谢你的帮助。将找到一个解决方案。在这里，我使用的黑客解决方案，可能是可以帮助你。自定义css将一些5像素添加到标签中。看起来是这样的。我觉得你的css已经被编辑得太多了，你能像我的更新一样手动使用bootsrap吗？我试了很多次。谢谢你的帮助。将找到一个解决方案。在这里，我使用的黑客解决方案，可能是可以帮助你。自定义css将一些5像素添加到标签中。看起来是这样的。