Give help. Get help.

  • # March 14, 2012 at 11:51 pm

    Anyone ever had a problem with the background image on a header disappearing when you add no-repeat? So,

    background-image: url("images/pic.jpg");

    displays the image, but with the image repeating.

    background-image" url("images/pic.jpg") no-repeat; 

    makes the picture disappear entirely. For reference, here’s the entire block for the header:

    body>header {
    background-image: url("images/epsoclogo.jpg") no-repeat;
    height: 300px;
    padding: 33px;
    color: #ccc;

    (display: block is specified in a global statement earlier in the css file). As extra info, this is a WP 3.3.1 build using the H5 theme by Jeff Starr.

    I have a horrible feeling I’m missing something terribly obvious and will be insanely embarrassed once someone points it out to me, but would be thrilled if someone can tell me what I’m doing wrong.

    # March 15, 2012 at 12:29 am

    If you copied and pasted your code then the issue is a simple typo.


    background-image" url("images/pic.jpg") no-repeat;

    Should actually be this:

    background: url("images/pic.jpg") no-repeat;

    EDIT: As @karlpcrowley already said.

    # March 15, 2012 at 7:58 am

    maybe :

    background: url(“images/pic.jpg”) transparent center center no-repeat;

    so you can control position (here : ‘center center’) and background-color (here :’transparent’ ) if your image upload fails.

    # March 17, 2012 at 12:18 pm

    Thanks for the help, folks — don’t know why I was stuck on using background-image instead of background — feel a bit foolish now, as I really did know that — thanks again!

    # May 10, 2012 at 1:17 pm

    you’re welcome !

    # February 28, 2017 at 6:40 pm

    Thank you to @karlpcrowley. That solution worked for me.

    Make sure you know what CSS property you are using. background has a no-repeat, whereas background-image does NOT, instead use background-repeat: no-repeat;

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

You must be logged in to reply to this topic.