自定义单选按钮在iOs Safari中不可见

Question

我在下面提到css来显示cutom单选按钮

input[type=radio]{
    display:none;
}
.radio-options label::before {
    content: "\2b24";
    color:#e2e2e2;
    display: inline-block !important;
    width: 17px;
    height: 17px;
    vertical-align:middle;
    margin-right: 8px;
    background-color: #fff;
    border: 1px solid #e2e2e2;
    border-radius: 8px;
    font-size: 9px;
    text-align: center;
    text-shadow: 0px 0px 3px #fff;
    font-family: monospace;
    padding-top: 1.8px;
    line-height: 10px;
    cursor: pointer;
}

.radio-options label.active-radio::before {
    content: "\2b24";
    color: #f9b410;
    background-color: #fff;
    font-size: 9px;
    text-align: center;
    text-shadow: 0px 0px 3px #fff;
    font-family: monospace;
    margin-left: 0px;
    padding-top: 1.8px;
    line-height: 10px;
}

<div class="radio-options">
      <div class="col-md-6 col-xs-6">
        <input id="some_thing" type="radio"  >
        <label ng-class="{'active-radio':true}">Something</label >
      </div>
</div>

在桌面浏览器中，它正常工作，并将单选按钮显示为

但在野生动物园中，它没有显示任何东西

有什么可能导致的建议？

Answer 1

这是因为您使用Unicode符号作为内容。它似乎没有出现在iOS上。如果您改为＆＃34; Black Circle＆＃34;相反它会工作。 （只需增加字体大小即可补偿大小。）

Unicode Black Circle symbol

Similar issue