在复选框列表文本和复选框之间添加空格答案

【问题标题】：Add White Space Between Checkboxlist Text and Checkbox在复选框列表文本和复选框之间添加空格
【发布时间】：2018-01-19 09:23:21
【问题描述】：

我正在尝试使用 cssclass 添加空格。我已经使用下面的代码进行了编码，但没有得到任何额外的空格。

为此编写代码的正确方法是什么？

.checkboxlistformat {
    margin-left:30px;
}


<div align="center" runat="server" id="checkboxlistdiv">
    <asp:CheckBoxList ID="checkboxlisttest" CssClass="checkboxlistformat" runat="server" RepeatLayout="table" RepeatColumns="4" RepeatDirection="vertical" OnSelectedIndexChanged="checkboxlist_SIC_SelectedIndexChanged"></asp:CheckBoxList>
</div>

【问题讨论】：

标签： html css asp.net webforms checkboxlist

【解决方案1】：

假设您的 ASP 为文本生成相应的<label>。您可以将带有祖先后代选择器的文本定位为.checkboxlistformat label：

.checkboxlistformat label {
  margin-left: 30px;
}

<input id="checkboxlisttest" type="checkbox" class="checkboxlistformat">
<label for="checkboxlisttest">Checkbox</label>

或者，您总是可以简单地将边距放在复选框的右侧：

.checkboxlistformat {
  margin-right: 30px;
}

<input id="checkboxlisttest" type="checkbox" class="checkboxlistformat">
<label for="checkboxlisttest">Checkbox</label>

希望这会有所帮助！ :)

【讨论】：

我在页面加载时从数据集中填充复选框列表。这会影响语法吗？
不 - 在页面加载后应用 CSS。假设您的输出生成<label>，则上述内容将起作用。如果没有，您可能需要展示您的渲染输出。
嗯......那么肯定有其他东西在干扰，因为它只是没有为我添加空格。我什至将 margin-right 设置为 60px 以确保:)
我明白了 --- 应该是 .checkboxlistformat label {}
这不起作用，因为 css 类未应用于标签，只是父元素（可能是跨度或表或 ul 或 ol，具体取决于 CheckBoxList 的 RepeatLayout。删除加上使其成为祖先后代选择器应该可以工作。