Question 317349 in Html Question posted in
Some basic documentation can be found here.

How to tile HTML elements from left to right using CSS

I have a website with some tiled HTML elements (tables), which are tiling left-to-right. I need the tables to be tiled from right-to-left, as the content of the tables is in Arabic. A picture of the current format is linked here.

Tags:

3

Answers


  1. Chosen as BEST ANSWER
    0

    dir="rtl" in the attributes for my <body> made the direction of the tiling right-to-left.


  2. 0

    you can use this comment in the html beginning tag

    And also use this styling in the css files
    table {

      width: 100%;
  border-collapse: collapse;
 
}
    Login or Signup to reply.
  3. 0

    Per my comment: Make the container of the inline-block elements right-to-left; then reset the English elements back to left-to-right.

    .glossed {
  direction: rtl;
}

.glossed > span {
  display: inline-block;
}

.glossed table {
  text-align: center;
}

.glossed tr + tr {
  direction: ltr;
}
    <div class="glossed">
  <span><table>
    <tr><td>(ar) We worship</td></tr>
    <tr><td>(en) We worship</td></tr>
  </table></span>
  <span><table>
    <tr><td>(ar) you alone</td></tr>
    <tr><td>(en) you alone</td></tr>
  </table></span>
</div>

    I put the direction directives in CSS for convenience, even though it is more common to have it as an HTML attribute (dir="rtl") since it normally pertains to the content, not style.

    Apologies I can’t write Arabic, but the parentheses should make it obvious which order is being observed in each line.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search