[Resolved] Secondary navigation items position

[Fernando Díaz Gascón]

Hello,

I put the secondary navigation in the web, in order to put the social networks. I choose navigation layout “Fluid/full width”, “float right” navigation position and “right” navigation allignment, and I find some issues:

– From 1024 px screen width till 768px, the menu items go to left side, instead of the right side configured.
– From 768px screen width to lower values, the menu items once I press the toggle goes to left side. In this case I would like to get them centered.

Thanks in advance

To see this issue, you can see my web in development with user and pass:

http://econactiva.es.mialias.net/
user: econac289
pass: q7lLHdjD

Thank you!

[Tom]

This should help:

@media (max-width: 1024px) {
	.secondary-nav-float-right .secondary-navigation {
		float: right;
	}
}

@media (max-width: 768px) {
	.secondary-navigation {
		text-align: center;	
	}
	.secondary-navigation .menu > li, 
	.secondary-navigation .sf-menu > li {
		display: inline-block !important;
	}
}

[Fernando Díaz Gascón]

Great! It was useful. Thanks a lot!

[Tom]

You’re welcome 🙂

[Fernando Díaz Gascón]

Maybe with some update I have lost one thing in http://econactiva.es/: I see that the secondary navigation items go to left side in mobile and they are not centered as I got with your code. It seems that:

.secondary-navigation .menu > li, 
	.secondary-navigation .sf-menu > li {
		display: inline-block !important;
	}

is not working anymore.

Is it due to an update? How can I center now the items?

Thanks!

[Leo]

Hi there,

Try replacing with this CSS:

.toggled.secondary-navigation .menu > li, 
.toggled.secondary-navigation .sf-menu > li {
    display: inline-block !important;
}

Let me know

[Fernando Díaz Gascón]

Sorry, it does not work. It is implemented in http://econactiva.es/ and if you see in narrow screens, you can see the social icons in the left side.

[Leo]

The social icons look inline on my phone. Try clearing browser cache?

Let me know.

[Author]

Posts