Format all labels after a checkbox and radio button with css selector

Question

I have radio buttons and checkboxes with each a label on its right side.

I want to format the label with a margin-left:10px; to have a distant to the radion/check controls.

input[type="checkbox"], input[type="radio"]  label {
    margin-left:10px;
}

This css is moving somehow the whole control + label 10px to the right side...

I just want the left margin on the label.

What do I have to change in my selector?

Answer 1

input[type="radio"] label is looking for a label that's a child of an input[type=radio] you want:

input[type="radio"] + label

for an adjacent sibling label

Answer 2

You need to specify them seperately. In your css you have applied the style to input[type="checkbox"] alone also.

Do it like this:

DEMO http://jsfiddle.net/aJPaq/

input[type="checkbox"] + label, input[type="radio"] +  label {
    margin-left:10px;
}