Jack
Jack

Reputation: 16724

How to align a control side-to-side?

I'm making dynamic radio buttons by using ASP.NET. Where there a validation control that I want to align side of this radios buttons.

Code:

<asp:RadioButtonList
                ID="tiposeg"
                runat="server"
                RepeatColumns="3">
                <asp:ListItem>a</asp:ListItem>
                <asp:ListItem>b/asp:ListItem>
            </asp:RadioButtonList> 
               <asp:RequiredFieldValidator ID="RequiredFieldValidator15" 
                ControlToValidate="tiposeg" 
                ErrorMessage='<% # foo.ErrorMessages.EmptyField %>'
                runat="server"
                />

The problem is: if making by using <asp:RadioButtonList, the <asp:RequiredFieldValidator is displayed into next line, unlike if I do it by using "HTML pure", that is displayed side of control (without need to use CSS). I hope this is clear. Thanks in adavnce.

EDIT in other words, it's possible put the <span> generated by asp:RequiredFieldValidator inside <table> generated by <asp:RadioButtonList?

EDIT 2

My current ASP.NET code;

 <asp:RadioButtonList 
    ID="RadioButtonList1"
    runat="server"
    RepeatColumns="3">
    <asp:ListItem>abcd</asp:ListItem>
    <asp:ListItem>xyz</asp:ListItem>
    </asp:RadioButtonList>

     </li>
     <li style="display:inline">

    <asp:RequiredFieldValidator 
    ID="ReqiredFieldValidator1"
    runat="server"
    ControlToValidate="RadioButtonList1"
    ErrorMessage="select atleast one radiobutton!"
    />

The form:

What I'm getting:

enter image description here

What I'm expecting:

enter image description here

Upvotes: 2

Views: 6231

Answers (2)

Michael Liu
Michael Liu

Reputation: 55409

Do you really want to arrange the radio buttons in a grid with multiple rows and columns? If not, delete the RepeatColumns attribute and add RepeatLayout="Flow" and RepeatDirection="Horizontal":

<asp:RadioButtonList runat="server" ID="RadioButtonList1"
    RepeatLayout="Flow" RepeatDirection="Horizontal">

This will render the radio buttons without a containing <table>, so the validator will appear to the right of the last radio button.

Upvotes: 8

Tim
Tim

Reputation: 4101

Could you achieve what you want by putting the controls in DIVs and floating them both left?

Upvotes: 0

Related Questions