The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Problem with background-image (resolved)

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
  • #37160

    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.


    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.


    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.


    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!


    you’re welcome !


    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)
  • The topic ‘Problem with background-image (resolved)’ is closed to new replies.