# Flip Directional Icons in Right-to-Left Languages

> Mirrors arrows, chevrons and other directional icons when the page is right-to-left, so "next" and "back" point the right way in Arabic, Hebrew and Persian.

- Type: CSS
- Runs: Site-wide header
- Category: [Multilingual](https://wpide.com/library/category/multilingual/)
- Tags: rtl, icons, css
- Author: WPIDE Team
- Installs: 0
- Updated: 2026-10-28
- Page: https://wpide.com/library/i18n-rtl-icon-flip/

## Code

```css
[dir="rtl"] .icon-arrow-right,
[dir="rtl"] .icon-arrow-left,
[dir="rtl"] .icon-chevron-right,
[dir="rtl"] .icon-chevron-left,
[dir="rtl"] .wp-block-post-navigation-link .wp-block-post-navigation-link__arrow-next,
[dir="rtl"] .wp-block-post-navigation-link .wp-block-post-navigation-link__arrow-previous,
[dir="rtl"] .wp-block-query-pagination-next-arrow,
[dir="rtl"] .wp-block-query-pagination-previous-arrow,
[dir="rtl"] .flip-in-rtl {
    display: inline-block;
    transform: scaleX(-1);
}
```

## Notes

Add your theme's icon classes to the selector list; logos and clocks should not be flipped.

## How to use it

Install the free WPIDE plugin (https://wordpress.org/plugins/wpide/), find "Flip Directional Icons in Right-to-Left Languages" in its snippet library and add it in one click; or create a new CSS snippet in WPIDE (or any code snippets plugin) and paste the code above. More snippets: https://wpide.com/library/
