Page specific full width customer background

resolved (6 posts) (2 voices)

  1. Society3
    Member

    Hi -
    I guess I'm brain dead by now. I just can't figure out how to set a full width custom background. I believe I tried everything.
    My last attempt was adding this to custom CSS
    .has_custombg #Body{background-image:url('/wp-content/uploads/GetAttention_2000x700.jpg');}
    not'n
    Still all white: http://accelerator.society3.com/game-changer/
    Any help? Thanks a lot in advance.
    Rob

    Posted 3 years ago #
  2. Elliott
    Support

    Hello Society3,

    It looks like your wanting to add a background image to the #content div,

    #content { background: url("URL to your image") !important; }

    Posted 3 years ago #
  3. Society3
    Member

    Awesome - thanks Elliot!

    1) How would I have found that solution myself? Is there an additional documentation?

    2) How do I get the background color set properly? This is what I did:
    #content { background-color:#1B213B !important; background: url("/wp-content/uploads/GetAttention_2000x700.jpg") !important; background-repeat:no-repeat !important; }

    But it shows black instead of the dark blue: http://accelerator.society3.com/game-changer/
    Thanks

    Rob

    Posted 3 years ago #
  4. Elliott
    Support

    Hmm, I'm not sure what's going on there. If you remove the CSS for the background image you'll see that the blue gets set but when you use that background image it looks darker for some reason. Perhaps it's a problem with the image? What happens when you use a different image.

    Posted 3 years ago #
  5. Society3
    Member

    Yes, Image alone works. The second statement (repeat / no repeat) gets translated as well. However the BG color not. Whyle the background-color statement is supposed to be before the image statement, I guess somehow it gets reverse translated. I moved the BGColor down and now it works.

    #content { background: url("/wp-content/uploads/GetAttention_2000x700.jpg") !important; background-repeat:no-repeat !important;
    background-color:#1B213B !important; }

    Strange - but well - it works.

    I guess you can close it :)

    Thanks

    Rob

    Posted 3 years ago #
  6. Elliott
    Support

    Oh, I see. For the first part you need this,

    background-image: url("url") !important;

    If you use just,

    background: url("url") !important;

    Then it overwrites all other background rules.

    Posted 3 years ago #

Reply

You must log in to post.

Construct WordPress Theme
Construct wordpress theme
Myriad WordPress Theme
Myriad wordpress theme
Method WordPress Theme
Method wordpress theme
Fusion WordPress Theme
Fusion wordpress theme
Elegance WordPress Theme
Elegance wordpress theme
Echelon WordPress Theme
Echelon wordpress theme
Dejavu WordPress Theme
Dejavu wordpress theme
Modular WordPress Theme
Modular wordpress theme