Newbie! CSS Background image not displaying, help please?-CodePudding

Am trying to put an image, in the background, at the two ends of a big div,

CSS Code :

}
.headall {
    background-color: #44546a;
    /*width: 100%;*/
    /*top: 0 !important;*/
}
.headl {
    width: 12%;
    float: left;
    /*display: table-cell;*/
    justify-content: right;
    transform: scaleX(-1);
    background-image: url(./images/leaves.png);
    background-repeat: no-repeat;
    background-size: 130px;
    
}

.headctr {
    width: 76%;
    display: inline-block;
    justify-content: center;
}

.headr {
    width: 12%;
    float: right;
    display: table-cell;
    justify-content: right;
    background-image: url(./images/leaves.png);
    background-repeat: no-repeat;
    background-size: 130px;
}

End Code.

However, the image will not display. Any ideas?

Many thanks, in advance.

Placing the image in the main file, works, but it puts it in the foreground....

CodePudding user response：

You need to add quote marks. And if your image file is not in the same folder as your css, you need two dots.

background-image: url("../images/leaves.png");