单选按钮在 ie 和 chrome 中消失

Question

下面是样式表

 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 不显示单选按钮？ 为什么这样？

Answer 1

这是因为您已经告诉单选按钮高度为 0% - 即 0px - 但它不存在。

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

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

Answer 2

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

尝试这个：

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

Answer 3

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

Answer 4

您需要将单选按钮放在

标记内，它们将出现在 Chrome 和 IE 中：

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