StudioPress

Forum navigation

Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

Background Image Sizing

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

Community Forums › Forums › Archived Forums › General Discussion › Background Image Sizing

This topic is: not resolved

Tagged: 

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • January 20, 2014 at 11:30 pm #86237
    kkuzik
    Member

    I have a site here: http://findingpurpose.com/, need to get my background image to line up with the blue line in the navigation bar, i set the background image to: background: url("http://findingpurpose.com/wp-content/uploads/2014/01/website11.jpg") no-repeat center center #F1F1F1; but wordpress resizes the image when it saves.

    Do i need to set it to be just a certain size?

    http://findingpurpose.com/
    January 21, 2014 at 9:23 am #86273
    David Chu
    Participant

    Hi,
    I've just had a similar discussion with my designer cohort. 🙂 A classic battle between Photoshop vs. a real site.

    I don't see resizing of background or header particularly. I can see bits of CSS pushing the header around. But to get both images' Big Solid Line to match up is a CSS smackdown. 🙂 That's why I would not use that line in either image, but would use CSS for that big line. That would require CSS nips and tucks, because this theme's container is not full-width.

    To combine those 2 big images is tricky, but possible with a lot of CSS tweaking. BUT... then when you get to responsive size, the whole thing goes "boom!" You'll see if you try it.

    Another approach would be to just scrap the header image, and combine the header image with the background image, but there may be some spacing issues with content at responsive sizing. That's why I've been encouraging my designer friend to think mobile before designing. What worked easily on fixed-width sites is no longer trivial.

    Sorry I don't have any simple answer to this intriguing problem.

    Cheers, Dave

    Dave Chu · Custom WordPress Developer – likes collaborating with Designers

  • Author
    Posts
Viewing 2 posts - 1 through 2 (of 2 total)
  • The forum ‘General Discussion’ is closed to new topics and replies.