Текст-заполнитель не вертикально центрирован в Safari

17

Есть ли у вас какая-либо идея о том, как получить атрибут placeholder для вертикального центра в сафари? Хотя, когда вы начинаете печатать, текст идеально по центру.

    
задан Donny 17.02.2012 в 06:52
источник

5 ответов

4

Прекрасно работает для меня:

<input type="text" name="first_name" placeholder="Search" style="height: 50px;">

Попробуйте изменить это:

#register-block-fields input {
width: 230px;
height: 41px;
padding-left: 40px;
padding-right: 20px;
height: 41px; // Changed from line-height
color: #878787;
font-size: 12px;
font-family: Arial, Helvetica, sans-serif;
background: none;
}
    
ответ дан Aram Kocharyan 17.02.2012 в 07:00
источник
15

Самый простой способ - использовать как свойства line-height , так и height CSS. Просто дайте текстовому вводу line-height с тем же значением, что и его height .

Кстати, ваш живой сайт выглядит хорошо для меня в хроме 16.

    
ответ дан Dagg Nabbit 17.02.2012 в 07:00
источник
13

Для меня лучшим решением является использование line-height: normal и hack для IE 8.

<input type="text" name="test_name" placeholder="Search">


input {
    height: 35px;
    line-height: normal;
    line-height: 32px%pre%/; /* for IE 8 */
}
    
ответ дан Mila 18.04.2014 в 10:34
источник
6

И эта ошибка тоже. Установка высоты линии в ems исправила это для меня. Он выглядит так же, как в Chrome, Safari (рабочий стол и iOS) и Firefox. и я добавил трюк \ 9, чтобы получить вертикальное центрирование в IE. вот мой css

height: 36px;       
line-height: 1.2em;
line-height: 26px; /*for IE */
    
ответ дан neocoder 07.10.2012 в 22:12
источник
4

-Safari Solution-

Я застрял в этой проблеме в течение долгого времени, несмотря на использование

input::-webkit-input-placeholder { line-height:normal!important; }

Оказывается, что с высотой строки в непосредственном input -ном элементе нарушалась моя input::webkit-input-placeholder line-height.

Расширенное решение:

Я удалил высоту строки в моем стиле ввода и исправил мою проблему.

    
ответ дан Ariella 13.06.2016 в 23:14
источник