Tagged: logo, mobile responsive, overlap, resizing
My logo which is the recommended 340px wide will not re-size properly when the browser is less than 480px wide. I have tried on my mobile phone, safari, chrome, ff. I also upgraded to 3.7 and Enfold 2.4 to resolve this issue. The problem still exists. When the screen size is less than 480px, the logo gets cut off and is not displayed properly. I have even tried several different combinations below from the forums with no luck in the custom styling section.
.logo img { height: 70px !important;
max-height: 100%!important; }
.logo > a { max-height: 70px!important; }
a# LuckyAnchor_228608484_7 { max-height: 70px!important; }
.logo img { height: 70px!important;
max-height: 100%!important; }
Please help, thank you.
Dennis
website URL
http://www.orlandofederallawyer.com/
I found this code in the forum and I believe it is working now.
@media only screen and (max-width: 480px) { .responsive .logo img { width: 250px!important; } }
Added this to the quick styling.
Dennis
Glad you fixed it, let us know if you have any more questions or issues :)
Regards,
Josue