Indenterat text för Radiobuttons

Hello World!

Jag har en bunt radiobuttons som är linjerade till sidans vänsterkant. Efter varje radiobutton har jag en förklarande text. På vissa radiobuttons så är texten ganska lång. Så lång att texten radbryts. Den text som hamnar på den undre raden linjeras till vänster och hamnar alltså under radioknappen. Jag skulle vilja att texten linjerades med första bokstaven i hela texten så att det såg lite snyggare ut. Detta går ju självklart att fixas med lite tabelltrixande men jag måste självklart fixa detta utan att blanda in tabeller.

Någon som har någon bra idé?

Du skulle kanske kunna använda relativ positionering? Här är ett exempel (med riktigt fula färger, hehe):

<div style="width: 100px; background-color: #996600;">
    <input type="radio" id="test1" name="test" style="position:relative; float: left; width: 14px;" />
    <label for="test1" style="display: block; position:relative; float: left; background-color: #993366; width: 78px;">Val 1</label><br />
    <input type="radio" id="test2" name="test" style="position:relative; float: left; width: 14px; clear: left;" />
    <label for="test2" style="display: block; position:relative; float: left; background-color: #CCCCCC; width: 78px;">Val nummer 2 som är lite längre</label><br />
    <input type="radio" id="test3" name="test" style="position:relative; float: left; width: 14px; clear: left;" />
    <label for="test3" style="display: block; position:relative; float: left; background-color: #99CC00; width: 78px;">Val 3</label><br />
    <div style="clear: both;" />
</div>