Archived topic
Make Mobile Menu Logo Different Image Than Desktop Menu Logo
3 replies · Started by Rylan Urban on September 24, 2016
Hey Tom,
I have an issue,
the menu logo for desktop on http://solarsellmarketing.com is awesome.
But when I view it on iphone 5s, the logo takes up so much space that it pushes the menu down a line and makes the menu bar look strange.
Can I simply change the image i use for mobile? Like for example - I'd just insert my site icon instead so there would be room.
Rylan
You'll need to reduce the width of your image at whatever breakpoint is necessary.
For example:
@media (max-width:500px) {
.main-navigation .sticky-logo,
.main-navigation .sticky-logo img {
width: 80px;
height: auto;
margin-top: 7px;
}
}
Thank you!!!
I've waited a long time to fix this. Glad I finally asked!!! Will be a part of every new website CSS going forward!
You're welcome :)