Resize logo or Inner Page Hero top spacing on mobile devices?

  • Is there a way for me to get the logo to be smaller on mobile devices? If I set Logo Max Height to a lower number, the logo looks OK on mobiles but too small on computers. Right now I have it set to 150px, I would prefer 200 or even 250, but when I set it to that the logo overlaps page titles on phones.

    Or in the alternative, is there a way for me to change the Inner Pages Hero Content Top Spacing for mobile devices? There is an option for it in the Front Page Hero settings, but not for Inner Pages. The pages look better on the computer with a lower Top Content Spacing %, but higher for mobile devices to fix the overlapping logo problem.

    Here’s an example of what’s happening. I’ve tweaked the logo/hero settings to look better on the phone for the time being, but because of the changes the site doesn’t look as nice on computers. https://tejadadesign.com/images/phones.jpg

    The page I need help with: [log in to see the link]

Viewing 1 replies (of 1 total)

  • Hello,

    For your logo issue on mobile mode, please, use this extra CSS code :

    @media screen and (max-width: 468px){
    .logo_col{
    max-width:30% !important;
    }
    }

    You can modify the value of max-width, according to your needs.

    Regarding your issues with the content spacing, please, specify on what header pages you want to set a content spacing, so I can help you with extra CSS code.

Viewing 1 replies (of 1 total)
  • The topic ‘Resize logo or Inner Page Hero top spacing on mobile devices?’ is closed to new replies.