Archived topic

Mobile Header/logo potrait vs landscape

5 replies · Started by Tristram on March 27, 2018

Viewing posts 1–6 of 6

March 27, 2018 at 10:33 am #532747

Hey,

Got my site up.

The one issue I've noticed is the header is fine in landscape on an iPhone but the logo is expanded and wrong in portrait.

I've disabled the mobile header, otherwise there is nothing in the header. All other pics load fine.

I see that others have mentioned this issue and that a resolution was in the works.

Is there a solution for portrait on an iPhone (small mobile device?). I'm not sure I understand why it works in landscape but not portrait.

Thanks

Tristram

March 27, 2018 at 6:10 pm #533102

Hi there,

I'm not sure if I understand the issue.

Can you activate the mobile header again to show me?

Thanks!

March 27, 2018 at 9:01 pm #533201

It's enabled now. No header at all except the logo I put in there. That's on my phone.

Disabled the header is fine (like the desktop) in landscape and a mess in portrait.

I want the mobile header disabled to show in portrait what one sees on the desktop and in landscape. The full pic even if small.

In other words the header is not responsive when mobile in portrait when mobile header is disabled.

Tristram

March 27, 2018 at 9:57 pm #533231

What you're seeing from the mobile header is normal - it's meant to display an icon as your logo, not a full header.

If you disable the mobile header, we can likely tweak the regular header a bit on mobile.

Try this CSS (with mobile header disabled):

@media (max-width: 768px) {
    .inside-header {
        padding: 10px;
    }
}

March 28, 2018 at 8:38 am #533950

Thanks Tom. That improves it a lot.

I played with the padding a bit:

@media (max-width: 768px) {
.inside-header {
padding: 0px 50px 10px 10px;
}

Now even easier to read the logo.

Thank you again.

March 28, 2018 at 10:28 am #534116

You're welcome :)

This archived topic is closed to new replies.