Canvas Support

Problem with main logo

1 reply · opened May 28, 2019

EEnriqueMay 28, 2019

Hi

I've started from index-corporate-2.html
I'm working with logo and am having strange behaviour

  1. I have my logo 400px width and 60px height

  2. I had to force it in the img tag so it seens kinda fine

  3. I had to disable in Chrome inspector the 100px height setting, but then it sets at top, not middle (vertically)

  4. Also, why 2 logos ? Should I make my logo in 2 different sizes ?

Which changes should I made ? I'm attaching a screenshot

Thanks

SSemicolon WebSTAFFMay 29, 2019

Hello,

  1. Currently the Header Height is set at 100px. So, the Logo we have used is 100px in Height with Transparent Paddings using Photoshop. You can consider using the following CSS code to make your Logo align correctly with the 60px Height:
#logo {
	margin-top: 20px;
	margin-bottom: 20px;
}

#header.sticky-header #logo {
	margin-top: 0;
	margin-bottom: 0;
}

  1. Delete the width and height Attributes from the Image Tag to avoid unexpected issues. Instead use CSS if you really need it.

  2. The Solution in Point 1 will fix this issue.

  3. Two Images are required for Standard and Retina Devices. Simply create a Duplicate Image in Double Resolution (800px Width and 120px Height in your case) so that your Logo looks sharp in Retina Devices like iPad, iPhone etc.

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