4 replies · opened Feb 23, 2022
I'm struggling to get the logo to display on a mobile device.
I've added data-mobile-logo and what I believe to be the appropriate media query. but the logo will not display on mobile devices.
You can see the website at https://bdc-root.com/MensClubBarbershop/
Hello,
We have just checked this out and which we can assure you that the Mobile Logos appear to be working correctly, the reason why it is not changing on your Website is because the same Logo Image is being used for both the Default and Mobile Logos. Please check the image attached to this reply.
Also, we noticed you do not have the .retina-logo related HTML Codes added in the Header which is vital for the Logos to display on Mobile Devices. Simply add this according to the Default Template and this issue should be resolved automatically.
Hope this Helps!
Let us know if we can help you with anything else or if you find any further issues.
That worked. Thank you very much.
The only challenge remaining is that I have tried everything I know of via I've tried media queries in css and sizing the logo itself, but on a mobile device the logo is distorted.
What am I doing wrong?
Sorry, I should mention that it's only installed on the index page for now.
AND the log is accurate at the bottom of the page , so you can compare the header logo to the real logo
Hello,
Thanks for your Patience!
We have checked this out more closely and the issue is because of the 10px Padding on the Top/Bottom of the Image using CSS in the css/custom.css File. Instead we recommend adding the Padding to the #logo DIV. Example:
[ch_pre type="css"].header-size-custom #logo {
padding-bottom: 10px;
padding-top: 10px;
}
.header-size-custom #logo img {
height: 200px;
}[/ch_pre]
Change this across your Custom CSS for all the Media Queries and this issue should be resolved.
Hope this Helps!
Let us know if we can help you with anything else or if you find any further issues.
Have the same question, or something new?
Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.
Reply on the dashboard