Greetings to all, this is my first time asking a question here.
I am currently facing an issue with a cell's background image. Interestingly, it displays perfectly in Chrome and Firefox, but the problem arises when using Internet Explorer.
In IE, the background image only appears where there is content within the cell. If there's text filling only half of the cell, the background image will also only show halfway down. I'm looking for a solution to make the background display fully, regardless of the content within the cell. Thank you in advance for any help.
Below is the CSS code I am using:
.game {
width: 40%;
max-width: 40%;
min-width: 40%;
display: block;
position: relative;
}
.game:after {
content: "";
background-image: url('image.jpg') !important;
opacity: 0.45;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: -1;
}