Repository navigation
bug: when direction is RTL hamburger menu appears on right side but animation comes from the left #30226
Description
Prerequisites
- I have read the Contributing Guidelines.
- I agree to follow the Code of Conduct.
- I have searched for existing issues that already report this problem, without success.
Ionic Framework Version
v8.x
Current Behavior
On a fresh repository generated using this command:
ionic start photo-gallery sidemenu --type=angular --capacitor
All I do is put the attribute dir="rtl" on the <ion-app> element, and the behavior becomes this:
side-menu.mp4
Expected Behavior
The menu should animate in from the right when dir="rtl" for the app.
Steps to Reproduce
ionic start photo-gallery sidemenu --type=angular --capacitor- Open
src/app/app.component.html - Change
<ion-app>to<ion-app dir="rtl"> npm start- Open web browser and click the hamburger icon in the upper right
- Observe the behavior in the video above.
Code Reproduction URL
https://github.com/vicatcu/photo-gallery
Ionic Info
Ionic:
Ionic CLI : 7.2.0 (/home/vic/.nvm/versions/node/v18.20.2/lib/node_modules/@ionic/cli)
Ionic Framework : @ionic/angular 8.4.3
@angular-devkit/build-angular : 19.2.0
@angular-devkit/schematics : 19.2.0
@angular/cli : 19.2.0
@ionic/angular-toolkit : 12.1.1
Utility:
cordova-res : 0.15.4
native-run : 2.0.1
System:
NodeJS : v18.20.2 (/home/vic/.nvm/versions/node/v18.20.2/bin/node)
npm : 10.5.0
OS : Linux 6.9
Additional Information
No response
Activity
brandyscarney commentedon Mar 3, 2025
Thanks for the issue! Is there a reason you can't set
diron the<html>element? We check for thedocument.dirin the code which isltrif you set it on the<ion-app>element:vicatcu commentedon Mar 3, 2025
In my application (many applications?) it needs to be parametric/dynamically set based on a user preference setting and bindings aren't possible in index.html (as far as I know?).
fix(menu): respect ion-app dir attribute for menu animation side
fix(menu): respect ion-app dir attribute for menu animation side
fix(menu): respect ion-app dir attribute for menu animation side
fix(menu): respect ion-app dir attribute for menu animation side (#31246
ionitron-bot commentedon Sep 17, 2026
Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.
fix(menu): respect ion-app dir attribute for menu animation side (ion…