Javascript 在div内并排对齐块

谢谢你在这里的出色工作

我很难在一个div中并排对齐块。我知道这并没有那么复杂，但我就是找不到一个好方法

此处为Html：

<div class="test">
   test
   <div class="container">
      <div class="row">
         <div id="header_logo"></div>
         <div id="tmsearch" class="clearfix">
            <span class="btn-toogle active"></span>
            <form id="tmsearchbox">
               <input name="controller" value="search" type="hidden">
               <input name="orderby" value="position" type="hidden">
               <input name="orderway" value="desc" type="hidden">
               <input class="tm_search_query form-control ac_input" id="tm_search_query" name="search_query" placeholder="What are you shopping for today ?" value="" autocomplete="off" type="text">
            </form>
            <button class="submit-buttons" id="search-bar-button" type="submit">Search</button>
         </div>
      </div>
   </div>
</div>

测试
搜寻

我在这儿

---

我非常感谢前端开发人员社区的帮助，请原谅我的新手问题。

您可以将

display:flex

添加到任何具有要并排显示的子元素的父元素中

.flex{
显示器：flex；
}

测试
搜寻

将该行添加到每个块样式属性中 浮动：左

像这样

#搜索栏按钮，
.tm_搜索_查询
{
浮动：左；
}

测试
搜寻

表单是类似于div的块级元素

我用一个补救办法把你的小提琴叉在这里：

我只是补充说：

form{display:inline block；}

到css，您的输入以内联方式显示

更新* 注意：display:flex目前不太受浏览器支持。

---

希望这有帮助

事实上，我想测试->搜索栏->搜索纽扣@Michael's answer如果你正在处理表单，那么按钮应该在里面，它将处理

flex

肯定非常重要useful@Michael非常感谢您的帮助并解决了我的问题。