HTML bdi: Main Tips
- HTML
<bdi>element separates text which needs to be displayed in a different direction than the rest of the content. <bdi>in HTML is similar to <bdo>. The main difference between these elements is that<bdi>separates and changes the direction of text, while<bdo>only reverses the direction.
Purpose of bdi
HTML <bdi> isolates the specified part of the text and displays it in a different direction than the surrounding content. Therefore, you can add Arabic or Hebrew phrases or words in the right to left direction instead of left to right.
Example
<h2><bdi>مرحبا بالعالم</bdi> That means Hello World in Arabic.</h2>Note: the use of this reverse tag helps to add Arabic content in non-Arabic websites that follow the regular left to right direction.
Browser support
Chrome
16+
Edge
-
Firefox
10+
IE
-
Opera
-
Safari
-
Mobile browser support
Chrome
-
Firefox
10+
Opera
-
Safari
-