[Resolved] Header Background + Mobile

Home Forums Support Header Background + Mobile

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
  • #114870

    Hi !!!!

    I use this code in the style.css of Mantle.

    .site-header {
          background-image: url('http://www.mysite.com/v2/wp-content/uploads/2015/06/TEST-Home-Page-V2.png');
    height: 299px;

    But, when I use the mobile version the png is too big (1400X300).
    How i can resize the background png size auto, if i use an iphone or an ipda ?

    Thank you….

    Lead Developer
    Lead Developer

    Background images on mobile are kind of a pain.

    You’re better off applying a different image suited for mobile when on smaller devices.

    For example:

    @media (max-width:767px) {
          .site-header {
                background-image: url('URL TO MOBILE IMAGE');

    Also, since you’re using a child theme we release updates to, I suggest you use methods #2 or #3 to add your CSS: http://generatepress.com/knowledgebase/adding-css/

Viewing 2 posts - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.