Is there a way to make a different logo image appear on mobile devices only? My current logo appears distorted and too large on mobile devices. Thanks!
Hey tonyska!
You can add following code to Quick CSS in Enfold theme options under General Styling tab to fix distortion issue
@media only screen and (max-width: 767px) {
.responsive .logo a, .responsive .logo img {
max-width: 85%;
height: auto !important; }}
Or you can add following code to Quick CSS to use different logo on mobile version
@media only screen and (max-width: 768px) {
.logo img { opacity: 0; }
.logo a { background-image: url(https://kriesi.at/wp-content/themes/kriesi/images/logo.png); background-repeat: no-repeat; background-size: contain; }}
Best regards,
Yigit
Perfect! Thank you!