Accessing a background image from a form's css
Posted: Mon Jul 06, 2020 1:09 am
I have created a simple form that shows a check box
Then I have linked CSS which styles the check box:
The issue that I am having is that the image reference isn't working. When I select the check box I expect an image to be displayed, but nothing is displayed at all.
If I set the style attribute of the checkbox in the form that image will be displayed, just not from the CSS. This will display my image:
Any ideas on how I might make that work?
Code: Select all
<form>
<input type="checkbox" name="fail1" value="1">
</form>
Code: Select all
input[type="checkbox"] {
-webkit-appearance: none;
width: 30px;
height: 30px;
background-color: red;
}
input[type="checkbox"]:checked {
background: url('[r:getStateImage("Dying", 30)]');
}
If I set the style attribute of the checkbox in the form that image will be displayed, just not from the CSS. This will display my image:
Code: Select all
<form>
<input style="-webkit-appearance: none; width: 30px; height: 30px; background: url('[r:getStateImage("Dying", 30)]');" type="checkbox" name="fail1" value="1">
</form>