Html.RadioButtonFor Radio Buttons不在Safari或Chrome中渲染

Question

糟糕！我的单选按钮在除Safari和谷歌浏览器之外的每个浏览器中呈现。

使用ASP.NET MVC 4，我在我的一个观点中写道：

    <!-- model property1 -->
    <div class="form-group col-md-4">
        @Html.LabelFor(m => m.property1)
        <div class="form-control">
            @Html.RadioButtonFor(m => m.property1, true)
            @Html.Label("Yes")
            @Html.RadioButtonFor(m => m.property1, false)
            @Html.Label("No")
        </div>
    </div>

但它在页面上看起来像这样：

所以我尝试给两个单选按钮提供唯一ID，看看它是否解决了问题：

@Html.RadioButtonFor(m => m.property1, true, new {@id = "property1_true"})
@Html.Label("Yes")
@Html.RadioButtonFor(m => m.property1, false, new {@id = "property1_false"}))
@Html.Label("No")

它没有。在Google Chrome中，HTML如下所示：

<!-- model property1 -->
<div class="form-group col-md-4">
    <label for="property1">Lorem ipsum dolor sit amet, consectetur adipisicing elit?</label>
    <div class="form-control">
        <input id="property1_true" name="property1" type="radio" value="True" />
        <label for="Yes">Yes</label>
        <input id="property1_false" name="property1" type="radio" value="False" />
        <label for="No">No</label>
    </div>
</div>

我正在运行Safari 5.1.7 for Windows和Chrome 37.0。

Answer 1

经过多次调查，解决方案非常简单。我没有仔细检查CSS：

input:not([type='checkbox']) {
    -webkit-appearance: none;
}

因此，它不是真正的浏览器兼容性问题，也不是编码问题，也不是格式错误的HTML问题（等等）。