Отступы многострочных меток

У меня есть следующий автоматически сгенерированный HTML:

Каков рекомендуемый способ, используя CSS, для отступов метки, чтобы там было какое-то пустое пространство под кнопкой?

Ответ 1

label {
    display: block;
    margin-left: 20px;
}
input {
    float: left;
    margin-left: -20px;
    margin-right: 7px;
}

Здесь скрипка: http://jsfiddle.net/hrfmt/. Играйте со значениями.

EDIT:

Если все браузеры, которые вам нужно поддерживать, могут понять display: inline-block, используйте вместо float.

Ответ 2

label {
   position:relative;
   padding-left:20px;
   display:block;
}

label input[type=radio] {
   position:absolute;
   top:4px;
   left:0px;   
}

http://jsfiddle.net/BrV8X/4/

Ответ 3

Вот пример того, как это сделать, не прибегая к поплавкам. При таком подходе вам нужно будет сделать магию с отрицательными полями.

input {
    display: inline-block;
    margin-right: -100px;
    /* The 2 below properties are just for "correct" vertical placement of the button. */
    margin-top: 5px;
    vertical-align: top;
}
label {
    display: inline-block;
    margin-left: 100px;
    margin-right: -100px;
}
div {
    /* Just some spacing between the radio buttons. */
    margin-bottom: 5px;
}

http://jsfiddle.net/4osbp0mo/2/