Close gap / remove default background image when viewed on mobile device

Hi

I hope you can help. I have built my site with BeTheme and it's working great on desktop - thanks. The problem I am having is that when optimised for mobile device, the site displays with a large gap between the header and the content - see image: 

image

It looks like it is displaying the default background image on the theme. I would like to close this gap so you can't see the background. Please can you help?


Many thanks

Greg


Comments

  • Hi Greg,

    as we see you have activated header image on mobile. Please go to Theme options > Layout > Header section and turn on "Header | Minimalist" button to remove it.
  • Hi - thanks for getting back to me so quickly. I already had this option selected. It works for the desktop site but not the mobile site. 

    If it helps I am running BeTheme version 3.2.1

    Thanks

    Greg

  • Your theme version is reason why it does not work properly :) If you will update theme to latest version, then this will work fine. But if you don`t want to update theme, then please use below css to remove this image from mobile:
    @media only screen and (max-width: 768px) { body:not(.template-slider):not(.header-simple) #Header { min-height: 0 !important; } }
  • Amazing. Thank you. I will use the CSS for the moment and update the theme once I have performed a backup

    : )
Sign In or Register to comment.