CODEWITHSUNDEEP
cssarabic
EnglishTeacherEric
EnglishTeacherEric

Reputation: 259

Format some text to the left, some text to the right, on the same time

I checked prior posts and still can't get this working. How do you align translations of a text on the same line to the left and to the right? I work with both Arabic and English. Thought about trying to use a table and some CSS, but how?

<table width="100%"><tr><td height="30px">
3) What services do you provide?
</td>
<td class="arabic">
ما هي الخدمات التي تقدّمها؟
</td></tr></table>

3) What services do you provide? ما هي الخدمات التي تقدّمها؟

Upvotes: 0

Views: 61

Answers (1)

Tushar
Tushar

Reputation: 87233

To show text from Right to Left you can use direction property.

Set the direction CSS property to match the direction of the text: rtl for languages written from right-to-left (like Hebrew or Arabic) text and ltr for other scripts.

.arabic {
  direction: rtl;
}
<table width="100%">
  <tr>
    <td height="30px">
      3) What services do you provide?
    </td>
    <td class="arabic">
      ما هي الخدمات التي تقدّمها؟
    </td>
  </tr>
</table>

You can also use float to make the text render to the right.

.arabic {
  float: right;
}
<table width="100%">
  <tr>
    <td height="30px">
      3) What services do you provide?
    </td>
    <td class="arabic">
      ما هي الخدمات التي تقدّمها؟
    </td>
  </tr>
</table>

Upvotes: 2

Related Questions