JSFiddle - React, Tailwind, and code Playground

by kyo shoyo

HTML

<div class="hoge">
<p class="text-right">右寄せ 失敗例</p>
</div>

<div class="hoge">
<p class="text-right2">右寄せ 成功例</p>
</div>


<div class="hoge">
<p class="text-right3">左寄せ 成功例 (レビューでもらったもの)</p>
</div>

CSS

.hoge p{
         text-align: left;
    }

.text-right{
    text-align: right;
}

.text-right2{
    text-align: right!important;
}

.text-right3{
   text-align: right!important;
}

.hoge .text-right3{
    text-align: left;
}