Hello,
I have set a different logo for the small screens, but it is not clickable any longer (to go back to the home/landing page).
I used the following CSS:
@media only screen and (max-width: 767px) {
.logo {
content: url(“LINK-TO-MY-LOGO”);
object-fit: scale-down;
width: 150px;
height: auto;
}
}
It works perfectly, but I’d like to make it clickable in order to go to the home page, and avoid adding “Home” to my mobile menu. (Link in the private section)
Do you know how I can achieve that?
Thanks!!
Best regards
Hi donkrisho,
Can you try to apply it to the anchor tag instead of the .logo, you can try to use this code:
@media only screen and (max-width: 767px) {
.logo a {
content: url(“LINK-TO-MY-LOGO”);
object-fit: scale-down;
width: 150px;
height: auto;
}
}
Hope it helps.
Best regards,
Nikko
Hi Nikko,
I thought I replied to you, but it seems like I didn’t, sorry for that. Thanks a lot, this fix worked perfectly! I indeed missed the anchor tag on the mobile logo version.
Thanks again!
Kind regards
Hi donkrisho,
No worries, we’re just glad that we could help :)
Thanks for using Enfold and have a great day!
Best regards,
Nikko