The following example has four elements in two spans:
label1:(input1) label2:(input2)
When you hit the button to switch the document.dir to 'rtl', it comes out
............... (input1):label2 :(input2) label1
Whereas what I expected and need is
............... (input2):label2 (input1):label1
Please help. I could live without the colons, but not with the broken span cum misleading labels.
Behavior the same in FF3.6 and IE7. And the first thing I tried was the simple way, without the label tag, as in
same prob.
label1:(input1) label2:(input2)
When you hit the button to switch the document.dir to 'rtl', it comes out
............... (input1):label2 :(input2) label1
Whereas what I expected and need is
............... (input2):label2 (input1):label1
Please help. I could live without the colons, but not with the broken span cum misleading labels.
Code:
<html>
<head><title>test page</title>
<script type="text/javascript">
function toggleDir()
{ if (document.dir == "ltr") document.dir = "rtl"; else document.dir = "ltr"; }
</script>
</head>
<body>
<div id = "chatControls" style="position: relative; border: 1px solid #a0a0bf; width : 470px;">
<span style='white-space: nowrap;'>
<label for='x'>Label1:</label>
<input type="text" id="x" value="11111" />
</span>
<span style='white-space: nowrap;'>
<label for='y' >Label2:</label>
<input type="text" id='y' value="22222"/>
</span>
<input style="width: 24px; font-size: 60%" onclick="return toggleDir();" type="button" value="<>" />
</div>
</body>
</html>
Code:
<span style='white-space: nowrap;'> Label1:<input type="text" id="x" value="11111" /> </span>
Comment