Tagged: mobile logo
-
AuthorPosts
-
November 3, 2021 at 11:30 pm #1327691
My customer is seeing the logo overlap the hamburger menu on his iPhone. I have a Google Pixel and it looks fine. It also looks fine in my browser when I use a viewport tool that allows me to scale to iPhone. So I’m wondering if there is any CSS I can add to fix the overlap issue I can try without actually owning an iPhone to test? I’v never come across this issue before. To be safe I just updated to the latest version of Enfold (I was one version old).
November 4, 2021 at 6:52 am #1327727Hey lzevon,
It looks good on my end too, do you know the resolution of the phone which this problem occurs on?
Best regards,
RikardNovember 4, 2021 at 3:38 pm #1327806Apple iPhone 11 Pro, which has a 5.8-inch display and a resolution of 2436 x 1125 at 458 ppi. Wasn’t sure if there were any others seeing this. I just tried adding some max-width responsive CSS to see if that helps.
November 5, 2021 at 7:26 am #1327877Hi,
Thanks for the update. Please try CSS like this to target iphone 11 pro specifically:
@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) { .responsive #top .logo { width: 50%; } }https://cmsdk.com/css3/what-are-the-iphone-11–11-pro–11-pro-max-media-queries.html
Best regards,
RikardNovember 5, 2021 at 4:16 pm #1327960Thanks Rikard! I also appreciate the link which seems to be a great resource. I’m all set now.
November 6, 2021 at 6:36 am #1327996Hi,
Great, I’m glad that we could help you out. Please let us know if you should need any further help on the topic or if we can close it.
Best regards,
RikardNovember 8, 2021 at 4:09 pm #1328237Yes, you can close it and thank you again
November 9, 2021 at 5:30 am #1328282 -
AuthorPosts
- The topic ‘logo overlaps hamburger only on iPhone’ is closed to new replies.
