Header CSS Problem

[Maisam]

Hi, Header RTL CSS have multiple problem as below: 1- Header style and Login style don’t change for me. I try to change it on “Appearance>Customize>Header” but it doesn’t work. 2- When WP is on RTL language, both of trigger and login slider, slide from left side. I want it work same as LTR mode (login slider and icon float and open from left side — trigger menu and icon float and open from right side) 3- On mobile (e.g iPhone5), when tapping on the login icon, the login slider appears on screen but it didn’t disappear by tapping on login icon or on the screen (please see screenshot here :link and test it here :link). 4- When the screen width is lower than 767px, the trigger icon didn’t float on the right side. I use WP custom CSS as below but it didn’t work. :link @media (max-width: 767px) header.mooc.app #trigger {float: right;} 5- When the screen width is between 767px to 991px, the trigger icon lay on the login icon :link 6- When the screen width is upper than 991px , The main menu didn’t change in the appropriate way to mobile menu. As you can see on the screenshot :link, the last links of main menu dropped down instead of changing to mobile menu and trigger icon appears Please let me know if you need admin access to WP.

[Anshuman Sahu]

This reply has been marked as private.

[Maisam]

This reply has been marked as private.

[Anshuman Sahu]

6. To resolve this issue (https://prnt.sc/j17fxm) you need to remove some menu items .the issue is appearing because its jus too many menu items for that width . Yes it does works on greater width but if you want uniformity in all pixels reslutions then you gotta remove some menu items or move them to submenu . 2. Yes the login trigger comes from same direction as of ltr site . It is not developed to more from other side for rtl as of now. We will fix it in future for rtl sites . track : https://trello.com/c/yzYBQNst   1. Well in app style header login styles wont work as it has its own special login style . Please try switching to other header styles and then check login styles .Just save the settings and then check the header and login styles in incognito mode as a non logged in user.   3. Provide some time to check this .   4. & 5. Please try adding this custom css in your wp-admin -> appearance -> customize -> custom css : .rtl header.mooc.app.fix #trigger { left: auto !important; right:-50px !important;}        

[Author]

Posts