Archived topic
Increase Identity (Logo) size on mobile header
3 replies · Started by Alice on June 19, 2018
I have site identity mobile image uploaded. How can I increase the size of its look on the mobile header? In fact, I'd like the mobile menu (Navigation menu) to look bigger as well. Does this require CSS? Please check the provided URL, and see the mobile phone version. Logo and menu are a bit small. Thx
Hi there,
Few ways for this:
1. Increase the menu item height with mobile toggle on:
https://docs.generatepress.com/article/menu-item-height-width/
2. Remove the mobile header logo padding with this CSS:
.mobile-header-navigation .mobile-header-logo img {
padding: 0;
}Adding CSS: https://docs.generatepress.com/article/adding-css/
You can also do both steps as well.
Let me know if this helps.
OK. I think I will use CSS padding 0 first, because I think changing menu height will increase the Desktop version header height as well. That is not good.
Is there a way for me to attach an image showing the mobile result?
The logo size looks OK with padding 0. Just that I like to move it towards the right a few pixels for spacing. Also I'd like to increase the mobile menu icon width too.
As mentioned above you can use the mobile toggle to adjust the menu item height for mobile only.
If you want to move the logo to the right then just add a bit of left padding like this:
.mobile-header-navigation .mobile-header-logo img {
padding: 0 0 0 5px;
}