- This topic has 4 replies, 3 voices, and was last updated 5 years, 8 months ago by
.
Hi,
My website logo looks fine on desktop, but when I open it on my smartphone, the logo looks pixelated.
What can I do about this?
2nd problem that you can see in the same screenshot is that the slider (I just have 1 image in it) font is incorrect. On desktop the font size stays the same, while the font weight is different for the words ‘personal,..’. On my smartphone the words with larger font weight are actually in lower font size.
For future questions, would you rather have me consolidate multiple small questions into 1 thread or do you want 1 issue per thread?
Thanks!
Hi @CommandPost,
Thank you for your questions.
My website logo looks fine on desktop, but when I open it on my smartphone, the logo looks pixelated.
What can I do about this?
You can resolve it by adding the following CSS code in the Custom CSS code option of your theme on the below path.
Admin Area -> Appearance -> Theme Settings -> Custom Code -> CSS Code
#page-container .sh-header-mobile-navigation .header-logo img { max-width: 100%; max-height: 100%; width: auto; height: auto; } #page-container .sh-header-mobile-navigation .header-logo { padding: 0; }2nd problem that you can see in the same screenshot is that the slider (I just have 1 image in it) font is incorrect. On desktop the font size stays the same, while the font weight is different for the words ‘personal,..’. On my smartphone the words with larger font weight are actually in lower font size.
Please ask slider related questions to the slider revolution support.
For future questions, would you rather have me consolidate multiple small questions into 1 thread or do you want 1 issue per thread?
If the questions are too small and related then you can ask maximum 2 questions in a single thread but do share your site URL and screenshots in each thread.
Best regards,
Shufflehound teamSolution for this topic
The css code didn’t help it. I missed a setting at the theme logo settings. Now I can put them on desktop and mobile on 30px height.
Thank you for the input.
Awesome great to see you got that achieved.
Please advise if you have more questions.
Have a fantastic day!
Hello,
My logo (light color) looks very pixelated on desktop and mobile, I have tried as your suggestion above but it doesnt work for some reason:
#page-container .sh-header-mobile-navigation .header-logo img { max-width: 100%; max-height: 100%; width: auto; height: auto; } #page-container .sh-header-mobile-navigation .header-logo { padding: 0; } But still it looks very pixelated. Please advise, Thank you,
