alineación y relleno para asp: CheckBoxList

Question

Tengo una CheckBoxList asp.net de la siguiente manera:

<asp:CheckBoxList ID="CheckBoxList_Genres" runat="server" RepeatColumns="3"> 
     <asp:ListItem Selected="True">Action</asp:ListItem> 
     <asp:ListItem Selected="True">Comedy</asp:ListItem> 
     <asp:ListItem Selected="True">Classics</asp:ListItem> 
     <asp:ListItem Selected="True">Documentary</asp:ListItem> 

[...]

Tengo dos problemas: el texto no se alinea con cada casilla, y en algunos navegadores (especialmente Safari), no hay espacio entre la casilla de verificación y el texto (el texto se desplaza hacia la casilla de verificación). Estoy al tanto de la respuesta publicada aquí: How to align checkboxes and their labels consistently cross-browsers

Sin embargo, no puedo encontrar la forma de implementar estos estilos en el contexto asp: checkboxlist; Sé que se puede establecer un estilo CSS para la lista de casilla de verificación, pero no creo que esto me permita establecer estilos separados para la "etiqueta" y la "casilla de verificación". La ayuda sería apreciada

Answer 1

Debe poder aplicar los mismos métodos a la propiedad CssClass de su control CheckBoxList como lo haría con una casilla de verificación normal.

Aquí hay un código CSS solía sangrar texto largo junto a una lista de casilla de verificación ASP.net:

.chkChoice input 
{ 
    margin-left: -20px; 
} 
.chkChoice td 
{ 
    padding-left: 20px; 
} 

ASP.net:

<asp:CheckBoxList id="ChkWork" runat="server" TabIndex="2" CssClass="chkChoice"> 

Answer 2

En las propiedades de la casilla de verificación lista, cambie la repetición de flujo a la tabla. Eso alineará las columnas.

Answer 3

algunos de los elementos de la lista de casilla de verificación, tiene etiqueta, para espacio entre el texto y el elemento, por ejemplo casilla de verificación, debe dar el tipo de elemento en Css.

Exlampel:

.myCheckBoxList label 
{ 
    padding-right: 5px; 
} 

y dar che clase CheckBoxList así:

CssClass="myCheckBoxList"