复选框底部边框在Internet Explorer中不可见

Question

复选框在Chrome中工作正常但在Internet Explorer中没有。

这是我的HTML代码：

BOOL keydown(int key)
{
    return (GetAsyncKeyState(key) & 0x8000) != 0;
}

这是我的CSS代码：

<div class="patient-div-w" style="width: 9.5vw;">
  <input type="checkbox" id="edema" class="input-checkbox-l">
  <label class="label-n" for="edema" style="line-height: 8vh;">Edema</label>
  <br>
</div>

单选按钮的问题也是如此。 任何形式的帮助都非常感谢。

Answer 1

试试这个：

让我们假设.patient-div-w的父级是.parent-div。所以我们需要做以下事情：

.parent-div{
  overflow: auto;
  zoom: 1;
}

这是一个非常常见的问题。您可以阅读更多相关信息here

Answer 2

试试这个 在你的代码中

<label class="label-n" for="edema" style="line-height: 8vh;">Edema</label>只需删除内联style="line-height:8vh;即可。它会起作用。

您可以使用以下代码作为参考，它将适用于IE，FF，Chrome

.input-checkbox-l[type="checkbox"] + label {
  box-sizing:border-box;
  padding:0px 20px 0px 55px;
  background:url(https://i.stack.imgur.com/EAkMC.png) no-repeat center left 5px;
  background-size: 30px;
  font-size:22px;
  margin-right:5px;
  display:inline-block;
}

您可以尝试不带图像

input[type="checkbox"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 20px;
  height: 20px;
  background-color: #fff;
  border: 1px solid #ccc;
  cursor: pointer;
  outline: none;
}

input[type="checkbox"]:checked {
 border:1px solid blue;
  outline: none;

}

div{
  display: inline-block;
}

div span{
vertical-align: super;
}

<强> HTML

<div>
<input  type="checkbox" name="" value="1"><span>Label name</span>
</div>