将文本与单选按钮对齐

Question

In below script :

<script type="text/javascript" charset="utf-8" src="http://static.polldaddy.com/p/6352993.js"></script>
<noscript><a href="http://polldaddy.com/poll/6352993/">This is very long test question to test how polldaddy handles questions that exceed that normal length............ yes a very long question indeed..............</a></noscript>​

I amending the width of the text so it fits into 220px. This causes the text to wrap underneath the radio button if it is of a certain length. As shown in this fiddle :

http://jsfiddle.net/25LjE/8/

The options should wrap to right of radio button as shown in diagram :

Is this possible ? I think I need to amend the class "pds-answer-span" ?

Answer 1

adding this style on CSS panel

.pds-input-label { width: 85% !important }
.pds-input-label, .pds-answer-input { float: left;  } 
.pds-answer-group { height: auto; overflow: hidden; /* float clearing */ }

you achieve the desired effect

Answer 2

Try this - http://jsfiddle.net/25LjE/11/

.pds-answer-input { margin-top: 4px; }

.pds-answer-input,
.pds-input-label { display: inline-block; max-width: 170px; }

Answer 3

remove this

.pds-input-label{
    width: auto! important;
}

add this (where 100px is your desired width)

#PDI_container6352993 .pds-input-label { 
    width 100px; 
}