Archived topic
How Do I Make The Mobile Menu Icon Bigger
7 replies · Started by Fredrick on January 27, 2022
Hello There,
I've been using GP for a while now and one small issue keeps bothering me. The SVG icon on the mobile menu is too small, How do I make them bigger?
Here's a screenshot of my mobile menu
See how small it looks on mobile?
The Generate Press Mobile Menu on the Other hand looks great on mobile.
How do I make that SVG icon on the mobile menu bigger please?
Hi there,
Any chance you can link us to the page in question?
You can use the private information field:
https://docs.generatepress.com/article/using-the-premium-support-forum/#private-information
Let me know :)
Alright, I've attached the URL in the private information box
Hi Frederick,
If it's specifically for the hamburger menu icon, you can add this CSS:
span.gp-icon.icon-menu-bars svg {
width: 2em;
height: 2em;
}Adjust the width and height to your reference. :)
Perfect. Can I also get the CSS for the menu search icon, please?
Sure. :)
If you want both these icons to share the same size, you can do it like this:
span.gp-icon.icon-menu-bars svg,
span.gp-icon.icon-search svg {
width: 2em;
height: 2em;
}If you want them to have different sizes, you can write the style this way:
span.gp-icon.icon-menu-bars svg {
width: 2em;
height: 2em;
}
span.gp-icon.icon-search svg {
width: 3em;
height: 3em;
}Beautiful <3
Thannks a lot. You were more than helpful
No problem. Glad to be of any help. Let us know if you need any help. :D
