Hello I want to have for every radio-button other image not for all button's same image. How would I do that? I tried it on many ways but none has worked yet..
My code with only 1 img for all radio-button is:
<head>
<style>
input[type=radio]:before {
display: block;
width: 50px;
height: 50px;
content: '';
position: absolute;
background-image: url(img.png);
background-size: 50px 50px;
pointer-events: none;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
}
input[type=radio]:checked:before {
background-image: url(img.png);
border:2px solid #3e6cd4;
box-sizing:border-box;
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
}
.radiostyle {
display:inline-block;
width: 50px;
height: 50px;
background-color: blue;
}
</style>
</head>
<body>
<input type="radio" name="radio1" class="radiostyle" value="1">
<input type="radio" name="radio1" class="radiostyle" value="2">
<input type="radio" name="radio1" class="radiostyle" value="3">
</body>
Thanks for help!
See Question&Answers more detail:os
