ionicons更換圖標

我使用的一個項目Ionicons，並已取代了標準的圖像進行無線電和複選框與這些icons.The問題我已經是實際的默認項通過Ionicons顯示呈現時複選框，並radion按鈕。ionicons更換圖標

我有以下HTML：

<input type="checkbox" 
     name="client{!! $client->uuid !!}" 
     class="checkbox-icon ion-android-checkbox-outline-blank" checked>

我也有下面的CSS：

.checkbox-icon:before, 
.radio-icon:before { 
    visibility: visible; 
    font-size: 20px; 
} 

.checkbox-icon.ion-android-checkbox-outline-blank:checked:before { 
    content: "\f374";  // icon for selected 
    font-size: 20px; 
    color: $brand-primary; 
} 

.radio-icon.ion-ios-circle-outline:checked:before { 
    content: "\f120";  // icon for selected 
    font-size: 20px; 
    color: $brand-primary; 
} 

input[type=checkbox].checkbox-icon.ion-android-checkbox-blank, 
input[type=radio].radio-icon.ion-record { 
    visibility: hidden; 
}

不過，儘管複選框/單選按鈕的行爲正確，我可以看到ionicon低於標準項目。這是由於圖標具有透明背景嗎？

我試圖改變不透明度爲100％，但它並沒有幫助。

來源

2016-03-29 TheRealPapa