css3 - @ font-face line-height / ver-alignment headache ...?

Question

Я работаю над сайтом для друга, и у меня возникли реальные проблемы с реализацией шрифта с помощью @ font-face

Проблема заключается в том, что шрифт находится на одной линии с рамкой, которую он создает. Если я сделаю прямоугольник высотой 10 пикселей с текстом, текст всплывает над тем местом, где он должен быть.

Когда я перетаскиваю текст, чтобы выделить его, в его швах появляется много дополнительных отступов в конце текста.

У меня такой вопрос, есть ли смещение текстовой строки в css или, по крайней мере, какая-то разновидность хака, или это просто мусорный шрифт, который я использую, и если да, то можете ли вы обрезать шрифты ...?

Я много смотрел в Интернете, но нашел много не правильного и неясного решения.

проблема - тест сайта:)

Я добавил лайк к живому тесту с двумя «кнопками» и контактом в верхнем левом углу, которые имеют проблему, поле имеет тот же размер, что и текст, но текст не находится в поле ...?

Answer 1

Попробуйте что-то вроде этого, я думаю, что это должно дать вам средне вертикально выровненный текст.

.button{
    height:30px;
    lineheight:100%;
}