Position RadioButtonList on right edge of window and keep text from overlapping it.
On a Web Form with lots of RadioButtonLists for "_Y _N _N/A" answers to questions I'm trying to position the RadioButtonLists in a straight column on the right edge of the window.
I have them positioned on the right edge okay like this
<style>
.ToRight{position:absolute
#container {padding-left:80px; padding-right:50px}
</style>
<asp:RadioButtonList CssClass="ToRight" ID="radTraining6Months" runat="server" RepeatDirection="Horizonta
<asp:ListItem>Y</asp:ListI
<asp:ListItem>N</asp:ListI
<asp:ListItem>N/A</asp:Lis
</asp:RadioButtonList>
The whole form is inside a <div id="container"></div>
The problem is that long questions will go to the 50px right edge before wrapping to the next line even if that makes the sentence overlap the RadioButtonList a bit.
I can move the right edge or margin of the questions over more by increasing the padding-right:50px to padding-right:100px or so, but that is not the effect I want.
I want want the text to wrap when it encounters the RadioButtonList so I can have the margins set to a reasonable width and still not overlap the RadioButtonLists.
I tried setting the margin-left and padding-left style of the RadioButtonList but that had no effect.
Any suggestions?
Thanks,
David
I have them positioned on the right edge okay like this
<style>
.ToRight{position:absolute
#container {padding-left:80px; padding-right:50px}
</style>
<asp:RadioButtonList CssClass="ToRight" ID="radTraining6Months" runat="server" RepeatDirection="Horizonta
<asp:ListItem>Y</asp:ListI
<asp:ListItem>N</asp:ListI
<asp:ListItem>N/A</asp:Lis
</asp:RadioButtonList>
The whole form is inside a <div id="container"></div>
The problem is that long questions will go to the 50px right edge before wrapping to the next line even if that makes the sentence overlap the RadioButtonList a bit.
I can move the right edge or margin of the questions over more by increasing the padding-right:50px to padding-right:100px or so, but that is not the effect I want.
I want want the text to wrap when it encounters the RadioButtonList so I can have the margins set to a reasonable width and still not overlap the RadioButtonLists.
I tried setting the margin-left and padding-left style of the RadioButtonList but that had no effect.
Any suggestions?
Thanks,
David
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
I tried floating the radio buttons, but they moved down to the next line. That just won't do. I think that adding a "width" attribute may help.
ASKER
<style>
.ToRight{position:absolute
</style>
to
<style>
.ToRight{float:right}
</style>
causes the RadioButtonLists to appear a one line below the question and some of them to not line up all the way to the right. I had tried float first.