CSS - 如何在一行中创建复选框和标签？

Question

如何将复选框和标签放在一行？

<style>
          @supports (zoom:2) {
            input[type=checkbox]{
            zoom: 2;
            }
          }
          @supports not (zoom:2) {
            input[type=checkbox]{
              transform: scale(2);
              margin: 15px;
            }
          }
          label{
            /* fix vertical align issues */
            display: inline-block;
            vertical-align: top;
            margin-top: 10px;
            color:black;
          }
        </style>
        <input  type="checkbox" name="check_gdpr" id="check_gdpr" checked /> 
        <label for="cc">Inform me by e-mail</label>

Answer 1

将输入包装在标签中：

<label><input type="checkbox" name="check_gdpr" id="check_gdpr" checked>Inform me by e-mail</label>

Answer 2

更新

vertical-align: top 

到

vertical-align: middle 

在你的CSS标签中它应该可以正常工作。

Answer 3

只需将您的复选框和标签放在span

中即可

例如<span class="get-inline"><lable>Inform me by e-mail</lable></span> <span class="get-inline"><input type="checkbox" name="check_gdpr" id="check_gdpr" checked /> </span>

现在添加这样的css：

.get-inline{display:inline-block;} 

我希望它会起作用