Cross-browser CSS for right align label position of textfield - textbox

Question

I'm using rightToLeft language for my UI, so I need to have label of textfield on right side. I tried using div with float:right for label and div with float:left for textfield. but it still doesn't align correctly in my form.
This is code sample:
<s:form action="processRegister" cssClass="form">
<div style="float:right;text-align:right">
<s:text name="label12.msg"/>
</div>
<div style="float:left">
<s:textfield name="username" cssClass="textfield" />
</div>
<div style="float:right;text-align:right">
<s:text name="label13.msg"/>
</div>
<div style="float:left">
<s:password id="password1" name="password" cssClass="textfield"/>
</div>
</s:form>
and when I used table and tried to put textfield on one column and label on the other column, they didn't align on one line.

Answer 1

In what way is it not aligning properly? can show us some screenshot and example of codings?
U wanna check your magin and padding of each field that is not aligning properly?
Make the margin and padding to 0 first.
Actually another way is to use a table, if it applies to you.
Inside individual cell, just make sure the padding/ margin is 0.
Then using the cell's alignment property to adjust the align problem.
From what I see, using table for form to align is definitely cross browser

Answer 2

This jsfiddle does what you want. The key is in clearing your floats so that all the input/label rows end up on their own distinct lines. It's also a good idea when using floats to specify widths on your elements whenever possible. This will prevent accidental float drop.
Also, for usability, I've added a <label> element so screen readers will know which <input>'s your labels apply to.
HTML
<form>
<div>
<label for="username">Username</label>
<input type="text" id="username" name="username" size="20"/>
</div>
<div>
<label for="password">Password</label>
<input type="password" id="password" name="password" size="20"/>
</div>
</form>
CSS
div {
clear: both;
width: 300px;
}
div label {
float: right;
text-align: right;
}
div input {
float: left;
}