Как адекватно исправить большую высоту строки, вызванную свойством font-size?

Question

[NAHB]

Делаю кавычки вокруг цитаты и хочу спозиционировать их с помощью top: 0 / bottom: 0 / left: 0 / right: 0. Несколько раз уже сталкиваюсь с проблемой, когда font-size так влияет на высоту, но не знаю что делать. Нужно чтобы высота соответствовала визуальной высоте кавычек.

JSFiddle

<div class="testimonials-quote-block"></div>

.testimonials-quote-block {
	width: 500px;
	height: 300px;
	background-color: black;
	position: relative;
}
.testimonials-quote-block::before, .testimonials-quote-block::after {
  content: "“";
	position: absolute;
  left: 50px;
  top: 0;
	font-size: 338px;
  background-color: royalblue;
	color: red;
}

Answer 1

[WapSter]

Использовать svg иконку вместо шрифта.

Answer 2

[televizor5259]

line-height: 0;