Верстка input на смартфоне. Обрезается placeholder. Почему?

Question

[Андрей Куклин]

Как видно со скрина на смартфоне обрезается placeholder. При этом, когда вводишь в input текст ничего не обрезается...

Jade (html)

div(class="constructor-input-with-remove")
    input(id="back-text" maxlength="10" type="text" name="text" placeholder="Введите текст")
    button(type="button" class="remove-input")

stylus (CSS)

.constructor-input-with-remove
    position relative
    input[type="text"]
        border 1px solid #959595
        width calc(100% - 32px)
        height 25px
        line-height 25px
        padding 5px 15px
        font-size 16px
        font-weight 400
    .remove-input
        position absolute
        right 10px
        top 0
        bottom 0
        margin auto
        width 20px
        height 20px
        background url("/i/remove-input.png") no-repeat center center
        cursor pointer
        transition opacity .2s ease-in
        border none

еще есть строка:

input[type="submit"], textarea, select  { -webkit-appearance: none; border-radius: 0; -webkit-border-radius:0; }

Что я делаю не так? Совсем не могу понять...

Answer 1

[Андрей Куклин]

всем спасибо) Это из-за шрифта...