Name ___ ___ ___
Mailing Address ___ ___ ___
Thanks for any help you can provide!
Best answer by marean
View original
How to right-align labels in a form type question?
+1
Does anyone know some Java script that would align labels on the right in a form? In other words, I'm trying to push the labels right up against the text box entry areas, so that the blank space between the label for the box and the box itself is eliminated as much as possible, like so:
Name ___ ___ ___
Mailing Address ___ ___ ___
Thanks for any help you can provide!
Name ___ ___ ___
Mailing Address ___ ___ ___
Thanks for any help you can provide!
Userlevel 7
+27
Add this to the addOnload function:
```
jQuery("#"+this.questionId+" td").not('.ControlContainer').css("text-align", "right");
jQuery("#"+this.questionId+" span.LabelWrapper").css("padding-right", "0px");
```
```
jQuery("#"+this.questionId+" td").not('.ControlContainer').css("text-align", "right");
jQuery("#"+this.questionId+" span.LabelWrapper").css("padding-right", "0px");
```
+1
Ah, I knew you'd have a solution, Tom - thanks! Fiddling with some of the other code snippets you've provided, I was able to get the entire question to align right (including the text boxes) but I couldn't figure out how to apply that to the labels only.
One follow-up comment: your second line of code doesn't appear to have any effect on the question, because I tried to modify that to put just a small padding between the text and the response box (changed the end to 2px), but I didn't see any difference. Then I commented the second line out altogether, and it looked just the same as with it. Any tip on how to get just about a space worth of padding to the right of the labels?
One follow-up comment: your second line of code doesn't appear to have any effect on the question, because I tried to modify that to put just a small padding between the text and the response box (changed the end to 2px), but I didn't see any difference. Then I commented the second line out altogether, and it looked just the same as with it. Any tip on how to get just about a space worth of padding to the right of the labels?
+1
Never mind, Tom. I tested things again and the reason I wasn't really seeing any difference with the padding line was because of the way the label text was wrapping. I guess what I actually need is a small bit of padding to the left of the text boxes instead...
+1
OK, I figured out how to get the desired effect by experimenting a bit more on my own. I used the following instead of what you suggested for the second line of code:
jQuery("#"+this.questionId+" td.ControlContainer").css("padding-left", "5px");
Is that a reasonable solution, or do you think there's a better one? Thanks again for the excellent help!
jQuery("#"+this.questionId+" td.ControlContainer").css("padding-left", "5px");
Is that a reasonable solution, or do you think there's a better one? Thanks again for the excellent help!
Userlevel 7
+27
> @marean said:
> OK, I figured out how to get the desired effect by experimenting a bit more on my own. I used the following instead of what you suggested for the second line of code:
>
> jQuery("#"+this.questionId+" td.ControlContainer").css("padding-left", "5px");
>
> Is that a reasonable solution, or do you think there's a better one? Thanks again for the excellent help!
>
>
Great! Sounds good to me.
> OK, I figured out how to get the desired effect by experimenting a bit more on my own. I used the following instead of what you suggested for the second line of code:
>
> jQuery("#"+this.questionId+" td.ControlContainer").css("padding-left", "5px");
>
> Is that a reasonable solution, or do you think there's a better one? Thanks again for the excellent help!
>
>
Great! Sounds good to me.
Leave a Reply
Enter your username or e-mail address. We'll send you an e-mail with instructions to reset your password.