Archived topic

Secondary navigation items position

7 replies · Started by Fernando Díaz Gascón on January 21, 2016

Viewing posts 1–8 of 8

January 21, 2016 at 4:30 am #167134

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!

January 21, 2016 at 9:57 am #167189

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;
	}
}

January 22, 2016 at 2:40 am #167307

Great! It was useful. Thanks a lot!

January 22, 2016 at 10:07 am #167391

You're welcome :)

February 20, 2017 at 4:28 am #281290

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!

February 20, 2017 at 6:10 am #281331

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

February 21, 2017 at 9:17 am #281971

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.

February 21, 2017 at 9:59 am #281997

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

Let me know.

This archived topic is closed to new replies.

Start building better websites today.