Можно ли настроить вертикальное масштабирование шрифта с помощью CSS?

Я использую встроенный шрифт для верхних навигационных элементов на сайте Helvetica65 и в 16px это идеальная ШИРИНА, но мне нужно, чтобы она была о 90% его текущей высоты.

В Photoshop решение прост - отрегулируйте вертикальное масштабирование.

Есть ли способ сделать то же самое с помощью CSS? И если да, то как хорошо ли это поддерживается?

Ниже приведено jsFiddle базовое навигационное кодирование.

Ответы

Ответ 1

transform свойство можно использовать для масштабирования текста:

.menu li a {
  color: #ffffff;
  text-transform: uppercase;
  text-decoration: none;
  font-family: "HelveticaNeue-Medium", sans-serif;
  font-size: 14px;
  display: inline-block;
  transform: scale(1, 1.5);
  -webkit-transform: scale(1, 1.5); /* Safari and Chrome */
  -moz-transform: scale(1, 1.5); /* Firefox */
  -ms-transform: scale(1, 1.5); /* IE 9+ */
  -o-transform: scale(1, 1.5); /* Opera */
}