Почему этот шрифт обрезается, что бы вы ни делали? ⇐ Html

[Anonymous]

Я использую шрифт Google almarai с простым вводом HTML, но почему этот шрифт обрезает некоторые буквы, как показано на изображении ниже


Я попробовал этот CSS, но он вообще не работает, даже Ай не смог в этом разобраться

Код: Выделить всё

@import url('https://fonts.googleapis.com/css2?family=Almarai:wght@300;400;700;800&display=swap');

@font-face {
font-family: "Almarai", sans-serif;
font-style: normal;
font-weight: normal;
font-display: swap;
src: url("/fonts/Almarai/Almarai-Regular.ttf") format("truetype");
}

input.arabic-input {
font-family: "Almarai", sans-serif;
background-color: burlywood;
font-size: 16px;
line-height: 2.6;
height: auto;
min-height: calc(1em * 2.6 + 24px);
padding-block: 22px;
padding-inline: 22px;
box-sizing: border-box;
overflow: visible;
-webkit-appearance: none;
}

Код: Выделить всё

Так что же не так? это проблема со шрифтом Google? или мне нужно разобраться с новыми волшебными строками?
и проблема только с вводом, но с остальными элементами управления все в порядке!
Я использую последнюю версию браузера Edge.

Подробнее здесь: https://stackoverflow.com/questions/798 ... hat-you-do