How to make room in the text of the dimly created checkboxlist

Question

How to make room in the text of the dimly created checkboxlist

Navigation

#1 by (1 votes)
#2 by (0 votes)

1

I'm trying to give a space between the square of the checkboxlist and the text, but it's not working, I followed the code.

<div class="form-group">
    <asp:Label ID="Label2"   Text="" runat="server"
        CssClass="col-sm-2 control-label" />
    <div class="col-sm-10 "> 
        <asp:CheckBoxList ID="cblEscolhaDaOpcao" runat="server" 
             DataSourceID="SqlDataSource1" DataTextField="Opcao" RepeatColumns="5" Width="100%" CellSpacing="10" CellPadding="10" > 
        </asp:CheckBoxList>
        <asp:SqlDataSource ID="SqlDataSource1" runat="server" 
            ConnectionString="<%$ ConnectionStrings:ConnectionString %>" 
            SelectCommand="SELECT [Opcao] FROM [ComandaOpcao]">
        </asp:SqlDataSource>
     </div>
</div>

How are you getting

asp.net asp.net-mvc

asked by anonymous 16.09.2015 / 13:30

2 answers

0

You can create a class in css to leave as you want checkBox .

For example, we'll add a class in checkBoxList ( CssClass="chkEscolhaOpcao" ) and use css to modify the style.

<asp:CheckBoxList ID="cblEscolhaDaOpcao" runat="server" 
             DataSourceID="SqlDataSource1" DataTextField="Opcao" RepeatColumns="5" Width="100%" CssClass="chkEscolhaOpcao"> 
        </asp:CheckBoxList>

And in your css file you add the style you want:

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

16.09.2015 / 13:52

Submit form after user action Vertical side menu to the bottom of the page

score 1 · Accepted Answer

Following the response in the here link >.

You can create a Css

 .test tr input {
            margin-right: 30px;
        }

And add to your checkboxlist through CssClass.

  <asp:CheckBoxList ID="cblEscolhaDaOpcao" runat="server" CssClass="test" DataValueField="Codigo" RepeatDirection="Horizontal"
                DataTextField="Opcao">
            </asp:CheckBoxList>

See it working here.

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>

</title>
    <style>
        .test tr input {
            margin-right: 30px;
        }
    </style>
</head>
<body>
    <form method="post" action="WebForm1.aspx" id="form1">
<div class="aspNetHidden">
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="CHHlRpgZ1fcj/nGoFbp8XKb51W/7QIo9OEkyUnRQPGftAqQjcjxKSvv9wYL02biZQiaWOAFQ0a/hvdBtgoK00aa8o3NF59Qug/Ox/aNTCkcc2KZTWOQEqFaZCGj50bJ/hEGoIgB8k0EnLKPZS/Gg2/yjwmGJo5Vgyvp2gf2/ymFF3MW9eytJ5k3ggbsiArpyZYsnjO7dbUAYGIgfhpXR2oS+gVIxzmpP8pS39Uo5V0H22FA0LWfApZNo+XLBvE0ARsCPRJJNDZUapqmQXpi0mFk3SkclEWlh3erqjE0qozZHfPbS9SchruSWabijDBbpDOv1tyUg5EAXrdaGFjhORCq0rQ60I+5SaEOv0HktK10=" />
</div>

<div class="aspNetHidden">

	<input type="hidden" name="__VIEWSTATEGENERATOR" id="__VIEWSTATEGENERATOR" value="C687F31A" />
	<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="ZtOBjR7he7tjyKWqoZd6L6CXsZPQ0hXlc1cUw0GqirsmZeOfvrQhr/MiTdBzuJ4gBLjL2uRNEkmQWnDyPJ0B5DP9VKv8QzUyLJ3Cxu1yIbDI7FOPyXtyZ/tYepThLCtxM9Wg1+I0zhdkQHXuujEG+kepfqOY/bk++xdcJMlf4R4=" />
</div>
        <div>
            <table id="cblEscolhaDaOpcao" class="test">
	<tr>
		<td><input id="cblEscolhaDaOpcao_0" type="checkbox" name="cblEscolhaDaOpcao$0" value="1" /><label for="cblEscolhaDaOpcao_0">Ademar</label></td><td><input id="cblEscolhaDaOpcao_1" type="checkbox" name="cblEscolhaDaOpcao$1" value="2" /><label for="cblEscolhaDaOpcao_1">Rosana</label></td><td><input id="cblEscolhaDaOpcao_2" type="checkbox" name="cblEscolhaDaOpcao$2" value="3" /><label for="cblEscolhaDaOpcao_2">Furukama</label></td>
	</tr>
</table>
        </div>

    </form>
</body>
</html>