how to make matblazor RTL (right to left)

Question

I'm new to Blazor and recently I'm learning it.

Does anyone knows how to make Matblazor components Right To Left ?

score 8 · Answer 1 · edited Dec 03 '20 at 15:13

8

You need to add dir=rtl to the body or a element that you want to create this effect (if you add this in a div, it will only apply to the elements inside that div).

Working example:

<body dir="rtl">
    <app>Loading...</app>

    <div id="blazor-error-ui">
        An unhandled error has occurred.
        <a href="" class="reload">Reload</a>
        <a class="dismiss"></a>
    </div>
    <script src="_framework/blazor.webassembly.js"></script>
    <script src="_content/MatBlazor/dist/matBlazor.js"></script>
</body>

Pictures:

edited Dec 03 '20 at 15:13

Vencovsky

28,550
17
109
176

answered Jan 21 '20 at 07:13

mhdcindioglu

310
2
6

Thank you Dear @mhdcindioglu you were right It works. I did not understand what you meant correctly. and wrongly I used __style="direction:rtl"__ instead of __dir="rtl"__ Thanks alot. – Arash.Zandi Jan 21 '20 at 19:32

score 3 · Answer 2 · answered Jan 19 '20 at 13:49

3

Just add dir attribute to body in you index.html and set its value to rtl

answered Jan 19 '20 at 13:49

mhdcindioglu

310
2
6

how to make matblazor RTL (right to left)

2 Answers2