input[type=checkbox] + span:before {
position: relative;
top: 4px;
}
<label title="добавить товар в сравнение">
<input class="compare" type="checkbox" data-id="199">
<span class="compareLabel">
<i class="fa fa-circle-o" aria-hidden="true"></i>
Сравнить
</span>
</label>
input[type=checkbox] {
display: none;
}
.compareLabel {
color: #98a4a7;
font-weight: normal;
font-size:14px;
line-height: 24px;
vertical-align: top;
display: inline-block;
}
.compareLabel i {
line-height: 24px;
font-size: 24px;
vertical-align: top;
display: inline-block;
}