Bdo forces an explicit text direction using dir=ltr or dir=rtl. It overrides the usual direction rules for the enclosed text.
What You Need to Know
Use it sparingly. If you merely need to isolate unknown user text, bdi is often safer and easier.
Example: See It in Action
Try this markup in a fresh practice file. The next section explains the parts worth paying attention to.
This is a short HTML fragment. To try it as a webpage, put it inside the body element of a complete HTML document.
<p><bdo dir="rtl">ABC 123</bdo>
</p>
<p>This forces right-to-left display for the text.</p>
<p>Use it only when an override is intentional.</p>Let’s Understand the Example
- Bdo explicitly overrides the direction in which text is displayed.
- A p groups a paragraph of related text. Start another paragraph for a new thought.
- Dir tells the browser which direction the text runs.
Look for the text “ABC 123” in the page. If the visible result surprises you, inspect the rendered elements to see what the browser actually built.
What Should You See?
The page should include “ABC 123”. If it looks different from what you expected, open developer tools and compare the source with the elements the browser created.
Try removing one piece of markup in a scratch copy, refresh the page, and compare the behavior. This is often the fastest way to understand what that piece contributes.
Try It Yourself
- Swap rtl and ltr and compare the displayed order.
- Save your changes, open or refresh the page, and compare the result with the original example.
- Tell a friend what your change did. If you are not sure, undo it, refresh the page, and compare.
Common Beginner Mistakes
- Applying bdo to a whole paragraph when only one inserted name needs isolation.
- Avoid picking tags just for their default bold, italic or spaced appearance. Use CSS for presentation.
Key Takeaways
- Bdo forces an explicit text direction using dir=ltr or dir=rtl.
- Bdo explicitly overrides the direction in which text is displayed.
- Use it sparingly. If you merely need to isolate unknown user text, bdi is often safer and easier.