Issues with Logo on Mobile

[#1]

Hi there, on mobile the logo on our blog ends up losing the aspect ration and the size ends up really wonky. We have tried a lot and nothing has changed. 

https://info.expeditors.com/featured 

Thank you! 

[#2]

Hi @MaddyForeman ,

Thank you for reaching out to HubSpot Community.

Could you provide some more details for the Community to help you here?

1. Could you attach a screenshot and specify the issue of your logo image? (i.e point out the area you want to fix)
2. How would you like to modify the logo?

Thank you,

Natsumi

[#3]

Here is a screenshot of the issues we are having. I would just like the logo to maintain the aspect ratio and not become distorted on mobile. We have played with the aspect ratio and sizing of the logo, but nothing changes on the mobile side. 

[#4]

Thank you @MaddyForeman for the screenshot.

I will ping @Stephanie-OG and @AJLaPorte_diagr here. I've seen they shared great knowlege around design queries, so they might have some advice for you.

Natsumi

[#5]

Hey @MaddyForeman 

After inspecting the site, it looks like you've got 2 width properties being set on the logo that is being deisplayed on mobile. See below in red:

Now how those got there I cannot speak to accurately, but…

Judging by the HTML structure it looks like the image is being added to the page via a Rich-Text module, and this is possibly why HS adds theses parameters (assuming it wasnt set in another way). See structure below:

I've highlighted a few pieces that might help you identify the culprit in the drag and drop editor.

• The "custom-logo" class might be add in the drag and drop editor itself.
• The "hs_cos_wrapper_type_rich_text" class kind of obviously tells us the module type

[#6]

Hi MaddyForeman,

I change this CSS in Inspect Element:

@media (max-width: 991px)
.custom-logo img {
    width: 177px!important;
    min-width: inherit;
}

.span4.widget-span.widget-type-rich_text.custom-logo p {
    margin: 0px;
}
}

And it worked. Look:

Now, you need try this changes in your CSS.

Hope this helps.