Archived topic
Logo size
5 replies · Started by Juned on January 31, 2021
Hi,
Do I need to use any specific size of logo at header (both at desktop & mobile view)?
I tried some options at settings too, but I am not satisfied with the logo appearance at both desktop & mobile.
Pls guide me.
Hi Juned,
The current one looks ok to me, so could you please tell me what's the exact appearance of the logo are you looking for?
Let me know :)
The proper sizes at Desktop and Mobile view. It looks like a little increased size will look proper??
Hi there,
You can control the size of the logo by adjusting the menu height on Appearance > Customize > Layout > Primary Navigation. But this mainly adjusts the menu-item's menu height.
To specifically adjust the logo size, try this CSS:
.navigation-branding img, .site-logo.mobile-header-logo img {
height: 80px;
width: auto;
}This adjusts for both mobile and the desktop logo.
If you want to have a different size for mobile viewport, you can use @media rule.
Example: (for mobile)
@media(max-width:768px){
.site-logo.mobile-header-logo img {
height: 90px;
width: auto;
}
}
.navigation-branding img {
height: 80px;
width: auto;
}Thank you very much Team.
If there's any problem, then I will report to you.
No problem. :)
