CSS:在较大的文本上删除行高(前导)

Question

如何从强制范围中删除前导,以便在<<上方和下方没有额外的空格.

字段行基于line-height文本大小的默认值占据一定高度,但是强制字段更高,因为字体大小更大.如何去除上方和下方的额外空白区域<<？

.fieldRow { /* for illustration only */
        border: solid 1px #f00;  
}
.mandatory {
        color: #f00;
	border: solid 1px #f00; /* for illustration 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">&laquo;</span>

</div>

Answer 1

删除vertical-align: middle它后看起来很好.

.mandatory {
  color: #f00;
  font-size: 24px;
  line-height: 0;
}

DEMO