best practice to use text-align: right when using a right-to-left language-CodePudding

suppose the project is in a right-to-left language (a language like persian or arabic that are right to left by default), which way is better to set text-align: right and direction: rtl ?

globally, e.g:

 body * {
  direction: rtl;
  text-align: right;
   }

or on-demand, meaning wherever we wanted the html to be direction: rtl or text-align: right ?

the latter way (on-demand approach) may result in many lines of code, for example:

.btn {
      direction: rtl;
      text-align: right;
     }
.nav {
      direction: rtl;
      text-align: right;
     }
.footer {
      direction: rtl;
      text-align: right;
     }

etc.

am I right? which way is more standard?

CodePudding user response：

When you set direction: rtl, Text direction goes from right-to-left directly.

So, All you will do is set direction: rtl to body:

body {
  direction: rtl;
  text-align: right;
}

and all of body texts direction will go from right-to-left directly, unless you specify otherwise for specific element.

body {
  direction: rtl;
}
.ltr {
  direction: ltr;
}
.left {
  text-align: left;
}

<body>
  <p>بسم الله الرحمن الرحيم</p>
  <p class='ltr'>In the name of Allah</p>
  <p class='left'>In the name of Allah</p>
  </body>