我正在尝试在某些单选按钮周围使用红色的边框,但是在Firefox最新版本或Chrome最新版本中却没有显示。在IE9 / IE8中可以正常工作。
表单上需要的每个输入元素都有MVC3放入的data-val-required属性。当我们有文本或文本区域输入时,所有浏览器的红色边框都显得很花哨,但单选按钮却让它很挣扎。对于IE,它可以工作,但其他浏览器不会在其周围加上红色边框。
CSS:
input[data-val-required], select[data-val-required], textarea[data-val-required]
{
background-color: #F0FFFF;
border: 1px solid red;
}
查看源:
<label for="WaiveSelect">Do you waive confidentiality?</label><br />
<input data-val="true" data-val-number="The field WaiveSelect must be a number." data-val-required="Please select waive." id="WaiveSelect" name="WaiveSelect" type="radio" value="0" /> No, I do not waive confidentiality<br />
<input id="WaiveSelect_2" name="WaiveSelect" type="radio" value="2" /> Yes, I waive confidentiality<br />
<input id="WaiveSelect_3" name="WaiveSelect" type="radio" value="3" /> Yes, I waive confidentiality except to the client<br />
<span class="field-validation-valid" data-valmsg-for="WaiveSelect" data-valmsg-replace="true"></span>
在IE中的外观(Firefox和Chrome无边框):
最佳答案
您可以通过用div标签包裹每个输入元素并为其赋予边框和左浮点数来完成...像这样:
<div style="border:1px solid red;float:left">
<input type="radio".. />
</div>
No, I do not waive confidentiality
关于css - 在单选按钮周围放置CSS边框,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/10849626/