Strong theme – responsive header image

Home Forums All Other Themes Strong theme – responsive header image

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #63661
    John
    Member
    • Topics: 1
    • Replies: 2
    • Total: 3
    Member since: January 27, 2017

    Having issues trying to get the image in the header to be responsive, shrinking on smaller screens and mobile. It does shrink a small amount, but then no further.

    If possible, I’d like to have a smaller image and have it right aligned in the container, and have it be responsive.

    Site is at http://damtodam.com/wordpress/

    Thank you!

    #63832
    John
    Member
    • Topics: 1
    • Replies: 2
    • Total: 3
    Member since: January 27, 2017

    Anyone able to help with this issue?

    #63879
    Forum Moderator
    Participant
    • Topics: 0
    • Replies: 25559
    • Total: 25559
    Member since: August 16, 2013

    Hi John,

    Kindly go to Appearance>>Theme Options>>Basic Settings>>Custom CSS Box:

    Add this code there:


    @media
    screen and (max-width:479px) {
    .header {
    background-position: -247px bottom;
    background-repeat: no-repeat;
    background-size: 175% auto !important;
    position: relative !important;
    }
    }


    @media
    screen and (min-width:480px) and (max-width:767px) {
    .header {
    background-position: -340px bottom;
    background-repeat: no-repeat;
    background-size: 171% auto !important;
    position: relative !important;
    }
    }

    Regards,
    Dave

    #63976
    John
    Member
    • Topics: 1
    • Replies: 2
    • Total: 3
    Member since: January 27, 2017

    Thank you for the help, was able to get this to work for several different devices starting with the css above and adding a few more media queries.

    Thanks!

    John

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