Question

这就是我的前端目前的样子。我试图弄清楚如何让下拉框彼此对齐。所以他们都将与最远的那个匹配。

ID 等于少于小于或等于 “＆gt;大于 =“＆gt;大于或等于

这就是HTML中的一个元素。

Answer 1

将每个放入宽度为div的div中，比如90％，然后将每个框浮动到右边。

Answer 2

对于没有设置宽度的动态解决方案，您需要使用2个包装容器。

顺便说一下，我不同意其他评论员建议使用表格进行布局，这是一个很大的禁忌。表应该用于数据，而不是定位。

＆＃13;

ul {
  display: inline-block;
  margin: 0;
  padding: 0;
  list-style: none;
}

＆＃13;

<ul>
  <li>text</li>
  <li>another example</li>
</ul>
<ul>
  <li>
    <select name="foo" id="foo">
      <option value="foo">foo</option>
    </select>
  </li>
    <li>
    <select name="bar" id="bar">
      <option value="bar">bar</option>
    </select>
  </li>
</ul>

＆＃13;

Answer 3

使用隐藏表并将元素放入其中。您可以根据需要为其添加CSS。

<html>
    <head>
    </head>

    <body>
        <table>
            <tr>
                <td>Some text</td>
                    <td>
                        <select>
                          <option value="volvo">Volvo</option>
                          <option value="saab">Saab</option>
                          <option value="mercedes">Mercedes</option>
                          <option value="audi">Audi</option>
                        </select>
                    </td>
            </tr>
            <tr>
                <td>abc</td>
                <td>
                    <select>
                      <option value="volvo">Volvo</option>
                      <option value="saab">Saab</option>
                      <option value="mercedes">Mercedes</option>
                      <option value="audi">Audi</option>
                    </select>
                </td>
            </tr>
        </table>
    </body>

</html>

对齐选择框和文本框

3 个答案: