Official - Free Fix for shrinking logo on mobile landscape view

[glennrocksvb]

If you have a logo taller than 40px in your vBulletin 5 forum, it will be shrunk to 40px height when you rotate your smartphone to landscape view. This is because by default, vB5 sets max-height of logo to 40px when in landscape mode.

To fix this issue, you need to override that and remove the max-height. To do this, add the very simple CSS below in css_additional template in AdminCP or in Sitebuilder > Style > CSS Editor.

/* Fix for small logo height in mobile landscape view - START */
.l-small #header .site-logo img {
    max-height: none;
}
/* Fix for small logo height in mobile landscape view - END */

Enjoy!

[NumNum]

Thank you!

[Fleet]

This wont fix the Ipad issues will it?

[glennrocksvb]

No. This is for mobile phones only.

[wheatcom]

Solved it. Thanks.
Works in vB 5.6.0.

[tenis]

I have tried it in 5.7.4 and is not working.

[glennrocksvb]

tenis, I checked your site and I don't see the CSS code in css_additional.css template. Where did you add the code?

[tenis]

It was removed already, I did not expected such a quick answer. Thank you.

I will put it again right now.

[tenis]

Still not working

[glennrocksvb]

I checked your site and the vB support forum and I noticed that on mobile landscape mode, it's showing desktop view. I'm not sure if this change was done intentionally or it is a bug. The body tag used to have l-small class on mobile but it was changed to l-desktop class on vB 5.7.5. I think this is a bug. I'll post on vB support forum.

[glennrocksvb]

I posted in vB support forum.

https://forum.vbulletin.com/forum/vbulletin-sales-and-feedback/licensed-customer-feedback/4481544-discuss-the-upcoming-release-of-vbulletin-5-7-5?p=4482599#post4482599

[glennrocksvb]

It's holiday today in the US so we may not get a response from their staff today.

[Learning]

I put this code in the Sitebuilder css box on my vB6 demo site and it didn't work. What'd I do wrong?

[glennrocksvb]

Is the demo site available to the public? Can you post the link? I need to inspect the page in order to see what's going on. Other custom CSS might be overriding the CSS code of this mod.

[glennrocksvb]

If the code in the first post doesn't work for some reason or if you also installed this other mod, then you need to change the code to:

/* Fix for small logo height in mobile landscape view - START */
#header .site-logo img {
    max-height: none;
}
/* Fix for small logo height in mobile landscape view - END */

[Learning]

The new code worked! Thanks. My site is the temporary vB6 demo site that I've been testing.