Image in title bar has too much space around it

  • I have an image in the title bar for this website, but I’ve found that if I don’t set the padding to about 175 px, the top and bottom of the image is cut off and the image area becomes very narrow. However, if I set the padding to that amount, there’s a HUGE amount of space above and below the image on the iPad and mobile versions.

    How do I get around this? Thanks!

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

Viewing 5 replies - 1 through 5 (of 5 total)
  • Theme Author sonalsinha21

    (@sonalsinha21)

    To resolved your pointed issue. Kindly add below code under :: Appearance >> Customize >> Additional CSS 

    @media screen and (max-width: 29.938em) {

    .page .title-bar.outside .overlay-color{padding:75px 0;}  

    }

    @media screen and (max-width:47.938em) and (min-width:30.000em) {

    .page .title-bar.outside .overlay-color{padding:75px 0;}  

    }

    @media screen and (max-width:63.938em) and (min-width:48.000em) {

    .page .title-bar.outside .overlay-color{padding:75px 0;}  

    }

    Thank you, but that didn’t do anything. There’s still a ton of white space above and below the title image on mobile. When I remove the padding (in Customize>Page settings> Single page title bar) it makes the title image narrow and cuts it off at the top and bottom. See at: playtheboardmarketing.com

    Theme Author sonalsinha21

    (@sonalsinha21)

    https://playtheboardmarketing.com/

    site can’t be reached. checked on VPN also.

    Thread Starter sarahb1963

    (@sarahb1963)

    It’s a regular http at the beginning, not https:

    https://playtheboardmarketing.com

    Thanks!

    Theme Author sonalsinha21

    (@sonalsinha21)

    Kindly use this CSS code to resolve spacing issue on mobile device.

    Kindly add below code under :: Appearance >> Customize >> Additional CSS 

    @media screen and (max-width:479px) {

    .page .title-bar.outside .overlay-color { padding-top: 0;  padding-bottom: 0; min-height: 122px;}

    }

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Image in title bar has too much space around it’ is closed to new replies.