The logo that I uploaded to our client's website looks bad on mobile. The bad quality makes it look distorted.
I first uploaded the logo at the precise size that I wanted it to be. Then when that didn't work, I uploaded a larger version and inserted the height setting on the theme options. This also didn't work.
I asked our designer if I was doing something wrong and he said that it's not the actual size that's the problem here, the theme outputs css to resize the logo for mobile. And that some style rules could fix it. Changing the logo size won't really make a difference.
Please advise on what we should do to resolve this issue.
Add this into the Custom CSS box located in your Salient Options panel :
@media only screen and (max-width: 1000px) and (min-width: 1px) {
html body header#top #logo img {
height: 51px!important;
margin-top: -17px!important;
}
}
Hi,
The logo that I uploaded to our client's website looks bad on mobile. The bad quality makes it look distorted.
I first uploaded the logo at the precise size that I wanted it to be. Then when that didn't work, I uploaded a larger version and inserted the height setting on the theme options. This also didn't work.
I asked our designer if I was doing something wrong and he said that it's not the actual size that's the problem here, the theme outputs css to resize the logo for mobile. And that some style rules could fix it. Changing the logo size won't really make a difference.
Please advise on what we should do to resolve this issue.
Kind Regards,
Loise Martins
Hey!
@media only screen and (max-width: 1000px) and (min-width: 1px) { html body header#top #logo img { height: 51px!important; margin-top: -17px!important; } }
ThemeNectar Support Team
Hi,
Thank you for the assistance. I have added the code and it is now working.
Thanks,
Loise