Question

我有10个这样的复选框：

[]  Arts   []  Dance  []  Karate 
[]  Volleyball   []  Basketball

我有以下css：

#tagstype_tags .tag_select {
    padding-left: 240px !important;
    width: 500px !important;
}
.tag_select label {
    margin-right: 15px;
    margin-left: 10px;
}

我怎样才能让它们看起来像这样？

[]  Arts         []  Dance        []  Karate 
[]  Volleyball   []  Basketball

Answer 1

这实际上取决于你的标记。例如，如果您有一个包含列表元素的列表，则可以执行此操作

<ul>
<li class="checkboxLI"><input type="checkbox" name="volleyball"><label>Volleyball</label></li>
<li ...
</ul>

然后你可以定义列表元素来显示＆＃39; inline-block＆＃39;无论你喜欢什么，都有一个固定的宽度关闭＆＃39;。你的标签会有例如左侧10px填充

ul {
    display:block;
    width:100%;
}
.checkboxLI {
    display:inline-block;
    width:150px;
}
.checkboxLI input {
    display:inline;
}
.checkboxLI label {
    display:inline;
    padding-left:10px;
}

唯一不能避免的是，如果标签太长，标签就会换行....

希望有所帮助，

乌韦

复选框和标签之间的间距相等

1 个答案: