Is there a way to eliminate the space above and below the mandatory span, specifically when using << within it?
The height of the field row is determined by the default line-height for the text size, but the mandatory field is taller due to its larger font size. How can I get rid of the extra white space surrounding the << symbol?
.fieldRow { /* example purposes only */
border: solid 1px #f00;
}
.mandatory {
color: #f00;
border: solid 1px #f00; /* example purposes only */
font-size: 24px;
line-height: 0;
vertical-align: middle;
}<div class="fieldRow">
<label for="select">Some field</label>
<select name="select">
<option>Any</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<span class="mandatory">«</span>
</div>