Fit div size to background image

Question

I\'m trying to set the size (both width and height) of a div to match it\'s background image size, but I can\'t get it working. The background image size has to be in percen

Answer 1

tag cannot adapt to background-image size, you need to use an tag and choose between height: auto for the div or javascript

// **** Problem ****

// Wrong html :


// with css :
.my_class {
    width: 100%;
    height: 100%;
    background-image: url(/images/my-image.jpg);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
}

//****  Solution ****

// use css:
.my_class {
    width: 100%;
    height: 100%;
    background-image: url(/images/my-image.jpg);
    background-size: contain;
}