I have a Grid with 2 checkboxes, but they are displayed on 2 separate lines and I need them to display in one line along with the label. I am using CSS Bootstrap and have set the Checkbox display property to inline.
Here is my CSS:
input[type="checkbox"] { cursor: pointer; display: inline;}
On my page:
<div id="Div1" width="auto" runat="server">
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false" GridLines="None"
CssClass="table table-bordered table-striped" Width="100%">
<Columns>
<asp:BoundField DataField="idTickets" HeaderText="ID" />
<asp:BoundField DataField="User" HeaderText="User" />
<!-- Other BoundFields here -->
<asp:TemplateField HeaderText="Approved/Denied">
<ItemTemplate>
<asp:HiddenField ID="UserValue" runat="server" Value='<%# Bind("User") %>' />
<asp:CheckBox ID="CheckBox1" runat="server" Text="Approved" OnCheckedChanged="CheckBox1_ChangeCheck"
AutoPostBack="true" />
<asp:CheckBox ID="CheckBox2" runat="server" Text="Denied" OnCheckedChanged="CheckBox2_ChangeCheck"
AutoPostBack="true" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
How can I configure these Checkboxes to display in just one row? This issue also occurs in two other pages.
Attached print:
My HTML code:
<tr><td>
<input type="hidden" name="GridView1$ctl02$UserValue" id="GridView1_UserValue_0" value="MXLozadaRa">
<input id="GridView1_CheckBox1_0" type="checkbox" name="GridView1$ctl02$CheckBox1" onclick="javascript:setTimeout('__doPostBack(\'GridView1$ctl02$CheckBox1\',\'\')', 0)">
<label for="GridView1_CheckBox1_0">Approved</label>
<input id="GridView1_CheckBox2_0" type="checkbox" name="GridView1$ctl02$CheckBox2" onclick="javascript:setTimeout('__doPostBack(\'GridView1$ctl02$CheckBox2\',\'\')', 0)">
<label for="GridView1_CheckBox2_0">Denied</label>
</td></tr>
Second Div with Checkboxes:
<div align="center" width="auto" id="DivCheckBox">
<input id="ckbApprovalAll" type="checkbox" name="ckbApprovalAll" onclick="javascript:setTimeout('__doPostBack(\'ckbApprovalAll\',\'\')', 0)">
<label for="ckbApprovalAll">Approved All</label>
<input id="ckbDeniedAll" type="checkbox" name="ckbDeniedAll" onclick="javascript:setTimeout('__doPostBack(\'ckbDeniedAll\',\'\')', 0)">
<label for="ckbDeniedAll">Denied All</label>
<br>
<br>
<input type="submit" name="btnSend" value="Send" id="btnSend" class="btn" align="center">
</div>