473,322 Members | 1,522 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,322 software developers and data experts.

How to maintain the integrity of adjacent spans in dir=rtl ?

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.

Expand|Select|Wrap|Line Numbers
  1. <html>
  2. <head><title>test page</title>
  3. <script type="text/javascript">
  4. function toggleDir()
  5.  {  if (document.dir == "ltr") document.dir = "rtl"; else document.dir = "ltr";    }
  6. </script>
  7. </head>
  8. <body>
  9.  
  10. <div id = "chatControls" style="position: relative; border: 1px solid #a0a0bf; width : 470px;">
  11.  
  12.    <span style='white-space: nowrap;'>
  13.    <label for='x'>Label1:</label>
  14.    <input type="text" id="x" value="11111" />
  15.    </span>
  16.  
  17.    <span style='white-space: nowrap;'>
  18.    <label for='y' >Label2:</label>
  19.    <input type="text" id='y' value="22222"/>
  20.    </span>
  21.  
  22. <input style="width: 24px; font-size: 60%" onclick="return toggleDir();" type="button" value="<>" />   
  23.  
  24. </div>
  25. </body>
  26. </html>
  27.  
Behavior the same in FF3.6 and IE7. And the first thing I tried was the simple way, without the label tag, as in
Expand|Select|Wrap|Line Numbers
  1. <span style='white-space: nowrap;'>
  2.    Label1:<input type="text" id="x" value="11111" />
  3. </span>
  4.  
same prob.
Jan 22 '11 #1
1 2330
Try floating the lables and inputs to left
Expand|Select|Wrap|Line Numbers
  1. <style>
  2. #chatControls label,
  3. #chatControls input{float:left;}
  4. </style>
Jan 23 '11 #2

Sign in to post your reply or Sign up for a free account.

Similar topics

3
by: Joe Green | last post by:
Hi, I am trying to do some documentation in DocBook XML format. The document is in UTF-8 and is in a right-to-left language. How do I tell a paragraph that the text's direction is rtl or ltr? ...
4
by: Alan J. Flavell | last post by:
It's not clear to me whether the bdo tag is supposed to also influence attribute values e.g titles on the bdo tag itself and/or on any enclosed tags. There have been suggestions for writing...
5
by: Jake | last post by:
Occasionally I come across: "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-GB" lang="en-GB" dir="ltr"> ......and so I have a...
5
by: Andreas Prilop | last post by:
Normally it would be unnecessary to mark your HTML documents as "left-to-right" because "DIR=LTR" is the default value. http://ppewww.ph.gla.ac.uk/~flavell/charset/text-direction.html...
2
by: sirshurf | last post by:
Hi, I am using a phpmailer class to send some staff over the email... I am tring to send it with text/html but for some reason the email are been converted to plain and all the headers are shown,...
1
by: hime | last post by:
Hello every body I want to know if there is a way to set the direction of txt boxes in the web form to rtl without having to do so for each box by it self and I can't change the direction for the...
7
by: eyal.herlin | last post by:
hi, i have the following demo code: <html> <head> </head> <frameset cols="30%,*"> <frame src=""> </frame> <frame src=""> </frame>
5
by: elsigh | last post by:
http://www.commoner.com/lsimon/horzscroll_rtl.html My question is if anyone knows of a way to get an element to expand across the entire viewport in IE in RTL without setting the body padding or...
14
nicebasic
by: nicebasic | last post by:
I have a small page with ASP. In one part of the program, when the user clicks on a button, I use the following code to call a VBScript Subroutine with the name of SubmitForm: <input...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
by: ryjfgjl | last post by:
ExcelToDatabase: batch import excel into database automatically...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
0
by: jfyes | last post by:
As a hardware engineer, after seeing that CEIWEI recently released a new tool for Modbus RTU Over TCP/UDP filtering and monitoring, I actively went to its official website to take a look. It turned...
1
by: PapaRatzi | last post by:
Hello, I am teaching myself MS Access forms design and Visual Basic. I've created a table to capture a list of Top 30 singles and forms to capture new entries. The final step is a form (unbound)...
1
by: Defcon1945 | last post by:
I'm trying to learn Python using Pycharm but import shutil doesn't work
1
by: Shællîpôpï 09 | last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome former...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.