asp.netvisual-studioradiobuttonlist

how to make the radio button list text is NOT below the radio button?

I am using visual studio 2013 and use the radio button list in ASP.Net. Im having problem with the text which it's not in line with the button. This is what I got and This is what I want here is my code

 <div class="form-group">
      <div class="row">
         <div class="col-md-2">
              <asp:Label ID="lbl6" Text="From Date" runat="server"></asp:Label>
         </div>
         <div class="col-md-2">
              <dx:ASPxDateEdit ID="datepickerFrom" runat="server" AutoPostBack="true" DisplayFormatString="yyyy-MM-dd" EditFormat="Date" EditFormatString="yyyy-MM-dd" NullText="Please select the date">
              </dx:ASPxDateEdit>
         </div>
            <div class="col-sm-2">
                <dx:ASPxDateEdit ID="datepickerto" runat="server" AutoPostBack="true" DisplayFormatString="yyyy-MM-dd" EditFormat="Date" EditFormatString="yyyy-MM-dd" NullText="Please select the date">
                    <DateRangeSettings StartDateEditID="datepickerFrom" />
                </dx:ASPxDateEdit>
             </div>
             <div class="col-md-2">
                <asp:CheckBox ID="cbHalfDay" runat="server" Text="Half Day" AutoPostBack="true" />
                                   <asp:RadioButtonList ID="rblHalfday" runat="server" Visible="false" RepeatDirection="Horizontal" CssClass="margin-5">
                                       <asp:ListItem Text="First Half&nbsp;&nbsp;&nbsp;&nbsp;" Value="1" />
                                       <asp:ListItem Text="Second Half" Value="2" />
                                   </asp:RadioButtonList>
            </div>
        </div>
 </div>
Solution

  • So,I try to use this in asp.net

     <div class="col-sm-8">
     <asp:RadioButtonList ID="rblHalfday" runat="server" Visible="false" RepeatDirection="Horizontal" RepeatLayout="Table" RepeatColumns="2" CssClass="mylist">
        <asp:ListItem Text="First Half" Value="1" />
        <asp:ListItem Text="Second Half" Value="2" />
        </asp:RadioButtonList>
 </div>

    and this is the css

     table.mylist label {
      width: 100px;
      display: block;
      float: left;
      margin-left: 20px;
      margin-right: 5px;
   }

    And the text in line like image below. BUT I want the text inline with the radio button too.

    This is what I got:

    This is what I got