将select和Input和Button HTML元素对齐在一行中

Question

有人可以帮助我在一行中选择下拉，输入和提交按钮。

我只获得行中的输入和按钮，但选择正在上升。

我在CSS中尝试了以下但没有工作

{{1}}

请帮助修改CSS以将所有内容排成一行。

Demo

Answer 1

你的例子到处都是。此外，＆＃34;选择＆＃34;应拼写＆＃34;选择器＆＃34;，但这不是重点。使用更多<div>元素包围较小的代码段。例如：

    <div>
        <div class="item"><p>Hello</p></div>
        <div class="item"><p>Stack</p></div>
        <div class="item"><p>Overflow!</p></div>
    </div>

通常情况下，这些<div>会显示在彼此之下。但是，如果我们添加类似于您正在使用的样式规则，我们将在一行上将这三个元素的结果放在一起。

.item {
    display: inline-block;
}

将您的按钮元素包裹在<div>容器中，并使用上述内容对其进行样式设置。这是否回答了你的问题？

Answer 2

我找到了解决方案，我只需要制作

inline-flex =＆gt; inline-flex使容器内联，同时仍保留flex布局属性。

display : inline-flex;