Tuỳ chỉnh nút radio không hiển thị trong iOs Safari

Question

Tôi đang sử dụng dưới đây đề cập đến css để hiển thị nút cutom đài phát thanh

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> 

Trong trình duyệt máy tính để bàn nó hoạt động chính xác và hiển thị nút radio như

Nhưng trong safari iOs của nó không hiển thị bất cứ điều gì

Bất kỳ đề xuất nào có thể là nguyên nhân có thể xảy ra?

Answer 1

Đó là do biểu tượng Unicode bạn sử dụng làm nội dung. Dường như nó không xuất hiện trên iOS. Nếu bạn thay đổi thành "Vòng tròn đen" thay vào đó, nó sẽ hoạt động. (Chỉ cần tăng font-size để bù lại kích thước.)

Unicode Black Circle symbol

Similar issue