Background Image image-set Not Working

[ben03]

Hi there,

  I am trying to get the browser to use a webp background image if supported, but the following css is showing as 'invalid property value' in chrome (Version 102.0.5005.61). I have tried several variations but no joy. Can you see what the problem is here?

 

.className {
        background-image: url(img/bg-3.jpg);
        background-image: -webkit-image-set(
            url('img/bg-3.webp') type('image/webp'),
            url('img/bg-3.jpg') type('image/jpeg')
        );
        background-image: image-set(
            url('img/bg-3.webp') type('image/webp'),
            url('img/bg-3.jpg') type('image/jpeg')
        );
    }

Thanks