Archived topic
Move menu items to right (RTL Translated Site)
7 replies · Started by Shakespeare on November 8, 2017
Hi,
- I'm using WPML as translator and I want to move some items in the right side of the menu. Seems like the tutorial you have doesn't work or may be I missed something: menu-item-float-right here are the items that I want to move: http://prntscr.com/h7u5rq
- In the primary menu seems like the spacing is not the same with the English version. I don't have any idea to fix it like the english version: http://prntscr.com/h7u6cj
Hoping for your assistance.
Hi there,
- Looks like you've added menu-item-float-left?
- Looks like you removed the dropdown menu toggle? If so try this CSS instead:
https://generatepress.com/forums/topic/arrow-on-menu-drop-downs/#post-172450
Hi Leo,
-I already added menu-item-float-right but it's still the same.
- The code was already added.. See my english version. It is working but not in arabic.
.menu-item-has-children .dropdown-menu-toggle {
display: none;
}
.main-navigation .main-nav ul li.menu-item-has-children > a {
padding-right: 20px;
}
You have this CSS below added which is making float right to float left and remove the padding on menu items:
.sf-menu>li.menu-item-float-right {
float: left!important;
}
.main-navigation .main-nav ul li.menu-item-has-children>a,
.secondary-navigation .main-nav ul li.menu-item-has-children>a {
padding-left: 0;
}
Hi Leo,
I'm not seeing those CSS you've mentioned.
=(
Since you removed the dropdown arrows, you need to re-add spacing to your menu items:
.main-navigation .main-nav ul li.menu-item-has-children>a,
.secondary-navigation .main-nav ul li.menu-item-has-children>a {
padding-left: 20px;
}
Typically we reverse things on RTL, so menu-item-float-right floats to the left (not very intuitive, needs some thought).
For now, you can do this:
.rtl .sf-menu > li.menu-item-float-right {
float: right !important;
}
Solved. Thanks Tom and Leo!
Glad we could help :)