CSS checkbox styling won't work - html

Question

I'm having a bit of a problem here. I read a ton of topics on this subject, but in won't work for me...
I'm making a theme for wp atm but I'm stuck on CSS checkbox styling, This is my CSS:
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;
}
And ofcourse my HTML:
<input class='lcheckbox' type="checkbox" /><label for="checkbox">Remember me</label>
So, is there anybody who can help me?
Thanks
Okay, I've got the first thing fixed, but now wheb I click nothing happens, and the label text is like:
Remember *Here's a enter, so we continue on the next line*
Me

Answer 1

<label for="checkbox"> works on an input that has the id checkbox.
Since your input doesn't have an id, it won't work.
Solution: give the input an id.
<input class='lcheckbox' type="checkbox" id="checkbox" />
^^^^^^^^^^^^^
(or any other id, as long as it matches the label's for attribute.)