Html – Problems adding a background image to a Div in React

I’m having trouble adding a background image to a div. In regular JavaScript, it works and allows me to define an object with a specific size and color. However, the same approach isn’t working in React. I’ve tried different methods, including adding the color in both the CSS file and the JSX file, but nothing seems to work.

I’ve tried the following methods, but they only work when I add text between the elements. I need them to work without text. Why is this happening?

import DiskImg from "../img/favicon.png";

<div 
      className="muplayer-songcover" 
      style={{ 
        backgroundImage: `url(${DiskImg})`, 
        backgroundSize: 'cover', 
        backgroundPosition: 'center',
      }}
    >
    </div>

.muplayer-songcover {
  background-image: url(../img/favicon.png);
  background-size: cover;
  width: 20rem;
  height: 20rem;
}