排列HTML彼此相邻。绝对和相对位置无济于事

Question

我有一个.html和CSS登陆页面，我想对其进行调整，以使一些html select标签彼此并排放置，但是该页面不断将其他选择控件排列到下一行。请看图片附件，以了解我的观点。我已经使用了CSS的相对和绝对定位，但是它们都没有帮助。

原始页面如下：

The original landing page

我想看到的预期页面，但是每次我写另一个选择标记时，它都会移至下一行而不是现有下拉菜单的一侧。参见第二页：

The final page i want to see

我的CSS文件很大，可以容纳在这里。我将在本文中附上。

谢谢你。

Answer 1

您应该将select放在某个容器中，并在选择框中应用display：inline-block。这是我们的抽象.html

<div>
  <select>
    <option>OPT1</options>
    <option>OPT1</options>
    <option>OPT1</options>
  </select>

  <select>
    <option>OPT2</options>
    <option>OPT2</options>
    <option>OPT2</options>
  </select>

  <select>
    <option>OPT3</options>
    <option>OPT3</options>
    <option>OPT3</options>
  </select>
</div>

和.css

select {
    display:inline-block;
    /* here padding, margin others styles.... */
}