Scaling an image logo on the Going Green child theme

Community Forums Forums Design Tips and Tricks Scaling an image logo on the Going Green child theme

This topic is: not resolved

Tagged: ,

This topic contains 3 replies, has 2 voices, and was last updated by  SoZo 1 year, 6 months ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #16919

    Jeff Hester
    Participant
    Post count: 28

    I’m using the Going Green theme for http://socalhiker.net and it works well with two exceptions that I could use some ideas on:

    The green background that appears across the top of the page disappears when the browser resolution drops below 1024px width. Not a deal-breaker, but I’d prefer to keep it (or something like it).
    The bigger problem is that the image I’m using for the logo gets cut off when you drop below 450px width. I’ve used a custom header image that’s 1100×100 (Appearance > Header).

    Any clever ideas on either of these two issues? On the logo in particular, it would be ideal if I could scale the logo once the browser dimensions drop below 450px width.

    You can test any of this by opening the site and resizing your browser window to replicate the two issues above.


    #16937

    SoZo
    Moderator
    Post count: 1573

    The best approach for the logo is to add different images as the background of #header for each of the responsive sections.

    And the green background is removed by this rule on line 1624

    #wrap {
    background: none;
    box-sizing: border-box;
    padding: 10px;
    }


    John “Nicolas Flamel” Wright | SoZo’s design| John Wright Photography

    #16954

    Jeff Hester
    Participant
    Post count: 28

    Thanks, John. I had to remove the custom header function from the functions.php first, but I’ve got it working much better now.


    #17050

    SoZo
    Moderator
    Post count: 1573

    You’re welcome :)


    John “Nicolas Flamel” Wright | SoZo’s design| John Wright Photography

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

The topic ‘Scaling an image logo on the Going Green child theme’ is closed to new replies.