Archived topic
Mobile header
5 replies · Started by _blank on December 17, 2019
I used this
#mobile-header .menu-toggle {
order: -1;
margin-right: auto;
}
.site-logo.mobile-header-logo {
position: absolute;
left: 50%;
transform: translateX(-50%);
}
to get my logo in between in mobile view but when i see it through customizer the logo appears in between but when i actually see it in the mobile the logo is not exactly at center it is little aligned to right.
Also i want to know how can i increase the size of the social icon. i am using font awesome.
And in mobile view the social icon which is in secondary nav bar becomes a menu. i dont want it to become menu in mobile version instead the social icon should be visible.
Hi there,
change your second CSS rule to this:
.site-logo.mobile-header-logo {
position: absolute;
left: 50%;
transform: translateX(-50%);
margin-left: 0;
}Hi!
it works thankyou!
Also i want to know how can i increase the size of the social icon. i am using font awesome.
And in mobile view the social icon which is in secondary nav bar becomes a menu. i dont want it to become menu in mobile version instead the social icon should be visible.
Hi there,
It looks like you're using Lightweight Social Icons now? If so, there's a font size option in the settings.
It also looks like you're using the top bar instead of the secondary nav, so the mobile version isn't an issue.
Let me know :)
Hi Tom,
first i was using font awesome for social media then came to know about your plugin.So now i am using it and it is super easy to do it with that plugin.
thank you so much!
Awesome, no problem!
