I seem to be facing a little issue here. Despite reading numerous discussions on this topic, I still can't get it to work for me...
Currently, I'm working on a WordPress theme and I've hit a roadblock with CSS checkbox styling. This is the CSS I have so far:
input[type=checkbox] {
opacity: 0;
}
input[type=checkbox] + label
{
background-image: url('images/main-sprite.png') no-repeat 0 -311px;
height: 20px;
width: 20px;
display:inline-block;
padding: 0 0 0 0px;
}
input[type=checkbox]:checked + label
{
background-image: url('images/main-sprite.png') no-repeat 0 -357px;
height: 20px;
width: 20px;
width: 16px;
display:inline-block;
padding: 0 0 0 0px;
}
.lcheckbox {
position: relative;
top: 43px;
right: 200px;
}
Additionally, here's my HTML code:
<input class='lcheckbox' type="checkbox" /><label for="checkbox">Remember me</label>
Can anyone provide some guidance on how to resolve this?
Thank you.
Update: The initial problem has been resolved, but now when I click nothing happens and the label text appears like this:
Remember *Here's a line break, so we continue on the next line*
Me