单选按钮在 ie 和 chrome 中消失答案

【问题标题】：radio buttons disappear in ie and chrome单选按钮在 ie 和 chrome 中消失
【发布时间】：2010-11-03 18:28:25
【问题描述】：

下面是样式表

 select,input ,td a {border:1px solid green; width:25%;height:25px;font-size:20px;margin-  left:.1em;}
input.myradio {border:none;width:0%;height:0%;font-size:0%;}

下面是html

<td><input class="myradio"  type="radio" name="poolstatus" value="Add">Add</input><td>

在 Firefox 中完美，但 chrome 和 IE 不显示单选按钮？为什么会这样？

【问题讨论】：

我不知道您是否没有正确复制/粘贴代码，但是您的 td 没有正确关闭并且您在 margin-left 中有一个空格
这是一个复制粘贴错字 - 抱歉

标签： html css internet-explorer google-chrome radio-button

【解决方案1】：

为什么要为它们指定 0% 的高度和宽度？我猜这就是 IE 和 Chrome 不显示单选按钮的原因，因为它们的大小为 0 像素。

【讨论】：

【解决方案2】：

我的猜测是 input.myradio 类中的“width:0%;height:0%”。你需要一个宽度和高度。

试试这个：

input.myradio {border:none;width:1em;height:1em;}

【讨论】：

它覆盖了不适用于收音机的通用选择规则，并且以 % 或 em 或 px 给出手动宽度不起作用，我不知道为什么但自动工作

【解决方案3】：

这是因为您已将单选按钮设置为 0% 高 - 即 0px - 不存在。

您可以通过将高度和宽度设置为“自动”来覆盖它，这将重置它们（除非在样式表的其他地方有更具体的规则）

input.myradio {
  border:none;
  width:auto;
  height:auto;
}

【讨论】：

是的，这很有效，我想覆盖通用选择的规则，因为它是全包的，并且 input['text'] 不能正常工作，非常感谢
input['text'] 不是有效的 CSS 选择器，我认为您的意思是使用“属性选择器”，即 input[type=text] - 但这不是在 IE6 中工作，所以由您决定是否要支持 IE6 :)

【解决方案4】：

您需要将您的单选按钮放在<form> 标签内，它们会出现在 Chrome 和 IE 中：

<form><input type="radio" /></form>

【讨论】：