[Resolved] Float some items from secondary navigation to left

[nik9]

Hello

I saw this post here: https://generatepress.com/forums/topic/secondary-navigation-how-to-float-some-menu-items-to-the-left/

We want to float instagram and facebook to the left. But we do not have the Top bar option in the customizer and therefore no option to merge top bar with secondary navigation. Why?

But, acutally we only want to float these two icons to the left. How can we do this? If we use left: for the icons, the whole content float to left.

[Leo]

Hi there,

But we do not have the Top bar option in the customizer and therefore no option to merge top bar with secondary navigation. Why?

The options are not showing as you don’t have any top bar widgets added.

You shouldn’t need to do that in this case though.

Can you set the secondary navigation to align left first? Then I’ll provide the CSS to make the Login link to the right:
https://docs.generatepress.com/article/secondary-navigation-layout/#navigation-alignment

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[nik9]

Hi Leo,

Thanks. I changed the align to left. Now we need to float login link to left. But, we have different navigation nodes there when a user is logged in or not. So maybe I can then try to use your code and try do float the other nodes (when a user is logged in) to the right.

Cheers

[Leo]

Sorry just to confirm, you want the login on the left and social icons on the right?

If so can you add the login as the first menu item? So in the order you want them to appear.

Let me know 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[nik9]

nope, insta and facebook on the left and every other stuff on the right side. 🙂

[Leo]

Ahh you are still using the float version as structure.

That case adding the menu-item-float-right class to the Login menu item should work:
https://docs.generatepress.com/article/adding-icons-to-menu-items/#floating-the-icon-to-the-right

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[nik9]

perfect! 🙂

[Leo]

No problem 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts