在表单中对齐选择和输入

Question

我想对齐输入和选择，但是当我在CSS中使用属性Display: table-column时，它并没有真正的用处。

    <div class="other-
        <!-- fourth question -->info">

        <p class="q-4"> <label> Things that should be improved in the future (Check all that apply):</label> 
        <div class="q-4">
            <input type="checkbox">Front-end Projects <br>
            <input type="checkbox">Back-end Projects <br>
            <input type="checkbox">Data Visualization<br>
            <input type="checkbox">Challenges<br>
            <input type="checkbox">Open Source Community<br>
            <input type="checkbox">Gitter help rooms<br>
        </div>  </p>
        <!-- end fourth question -->

        <br>

和我的CSS代码：

label{
  display: inline-block;
  float: left;
  width: 250px;
  text-align: right;
}

form input,
  form select {
  display: table-column;
  margin-left: 50px;
}

Answer 1

这就是你想要实现的吗？

​

<div class="other-
            <!-- fourth question -->info">

            <p class="q-4"> <label> Things that should be improved in the future (Check all that apply):</label> 
            </p><div class="q-4" style="display: inline-block;">
                <input type="checkbox">Front-end Projects <br>
                <input type="checkbox">Back-end Projects <br>
                <input type="checkbox">Data Visualization<br>
                <input type="checkbox">Challenges<br>
                <input type="checkbox">Open Source Community<br>
                <input type="checkbox">Gitter help rooms<br>
            </div>  <p></p>
            <!-- end fourth question -->

            <br>

    </div>