CSS layout in different language!

HTML & CSS
1

Hi guys

I would appreciate any help with my problem. I have an online survey in two languages. The English version is fine. But the Arabic one is not. In the English version, items are on the lift and the scale is on the right. See this example
http://www.ysatisfy.com/satisfaction_metrics/weighting.html

I don’t know how the change the direction the other way round in the Arabic version. (In Arabic, words are read from right to lift).

It’s something to do with CSS layout, which I’m not familiar with.

If anyone can help, I will pm him the survey link and the layout.css file.

Many thanks in advance for your kindness !!

2

http://www.w3schools.com/css/pr_text_direction.asp

3

For the sake of everyone else following this thread.

The nature of the survey was sensitive and that is why he didn’t really want to post it here. Also he was a little overwhelmed by the answers. So unfortunately didn’t want to ask any more questions since web design is not his forté and felt a little stupid asking for further clarification.

Add dir=“rtl” to the html tag any time the overall document direction is right-to-left. This sets the base direction for the whole document, i.e. right to left flow.

An extremely crude rtl text direction version (using markup) would be similar to the following:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang=
"ar" lang="ar" dir="rtl">
  <head>
    <meta http-equiv="Content-Type" content=
    "text/html; charset=UTF-8" />
    <title>
      Test File
    </title>
<style type="text/css">
  /*<![CDATA[*/
  body:lang(ar) {
  font-family : "Traditional Arabic", serif;
  } 
  /*]]>*/
</style>
  </head>
  <body>
    <p>
      &#1604;&#1575; &#1571;&#1578;&#1603;&#1604;&#1605; &#1575;&#1604;&#1593;&#1585;&#1576;&#1610;&#1577;
    </p>
  </body>
</html>

Obviously for a separate CSS file you have to consider direction and how the layout and block and FORM elements themselves flowed. UTF-8 would be in play here for simplicity.

4

There’s a lot of info here also:

http://www.w3.org/TR/i18n-html-tech-bidi/
http://www.w3.org/TR/html401/struct/dirlang.html

5

You may also want to add dir=“rtl” to the html tag any time the overall page direction is right-to-left even though Unicode is supposed to sort that out.

Do not use CSS styling to control directionality in HTML you should use markup as directionality is an integral part of the document structure and needs to be persistent.

Else do you mean if you already have sorted text direction and only want to alter the block positions and direction?