Radio button formatting in IE8 (not displaying correctly)
- by Kevin
I'm having a problem with getting my radio buttons laid out (and checkboxes) correctly in IE8 .. Firefox, Chrome, Opera all working however ..
Here is a screenshot of the problem
The code is below:
<label for="AdditionalResponses_0__Response" id="AdditionalResponses_0__Response_Label">Single answer</label>
<div class="row " id="AdditionalResponses_0__Response">
<input id="AdditionalResponses_0__Response_one" name="AdditionalResponses[0].Response" type="radio" value="one" />
<label for="AdditionalResponses_0__Response_one" id="AdditionalResponses_0__Response_one_Label">one</label>
<input id="AdditionalResponses_0__Response_two" name="AdditionalResponses[0].Response" type="radio" value="two" />
<label for="AdditionalResponses_0__Response_two" id="AdditionalResponses_0__Response_two_Label">two</label>
<input id="AdditionalResponses_0__Response_three" name="AdditionalResponses[0].Response" type="radio" value="three" />
<label for="AdditionalResponses_0__Response_three" id="AdditionalResponses_0__Response_three_Label">three</label>
<input id="AdditionalResponses_0__Response_four" name="AdditionalResponses[0].Response" type="radio" value="four" />
<label for="AdditionalResponses_0__Response_four" id="AdditionalResponses_0__Response_four_Label">four</label>
</div>
Sorry for the one long line, but that's how I got it through the source..
Here is the CSS:
.row input (line 471)
{
float: left;
display: inline;
width: 16px;
height: 16px;
margin-top: 0pt;
margin-right: 5px;
margin-bottom: 0pt;
margin-left: 0pt;
}
.row label (line 479)
{
float: none;
font-weight: normal;
font-size: 12px;
line-height: 16px;
}
div.panes label (line 70)
{
font-size: 95%;
font-weight: bold;
color: #222222;
line-height: 150%;
padding-bottom: 3px;
display: block;
}
