Lifestyle Pro site header image responsive sizing issue &

Community Forums Forums Design Tips and Tricks Lifestyle Pro site header image responsive sizing issue &

This topic is: resolved

This topic contains 2 replies, has 2 voices, and was last updated by  YippyMomma 4 months, 2 weeks ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #93859

    YippyMomma
    Participant
    Post count: 89

    Working on a site and we had issues with the header logo. So we uploaded an image into the site header that had a logo in it. Unfortunately, it’s not completely responsive. The image looks fine on the iPad, but not on the iPhone

    This is the code we used to insert an image into the site header

    .site-header {
    background-color: #fff;
    background-image:url(‘http://75.103.92.60/wp/wp-content/uploads/2014/02/Header1_with_logo.jpg’);
    background-repeat:no-repeat;
    background-position: center;
    height: 300px;
    padding: 48px;
    padding: 4.8rem;
    overflow: hidden;
    }

    So then we tried this for the responsive piece but with only the logo:

    @media only screen and (max-width: 240px) {
    .site-header {
    background-color: #fff;
    background-image:url(‘http://75.103.92.60/wp/wp-content/uploads/2014/03/logo_clear1-240.png’);
    height: 67px;
    width: 240px;
    }

    Need some help. Site is http://mothersandmore.org

    http://mothersandmore.org
    #93897

    benjeeno
    Participant
    Post count: 248

    iphone is 320px for the vertical and 480px for the horizontal:


    @media only screen and (max-width: 320px) {
    }

    #104171

    YippyMomma
    Participant
    Post count: 89

    Thanks.

Viewing 3 posts - 1 through 3 (of 3 total)

The topic ‘Lifestyle Pro site header image responsive sizing issue &’ is closed to new replies.