3 заметки с тегом

css

5 августа 2014, 13:15

input type=search и placeholder в Chrome

С появлением новых типов инпутов в HTML 5, появились и новые проблемы с их отображением в некоторых браузерах.

Так, например, Chrome последних версий выводит поисковое поле

<input type="search" />

следующим образом:

Проблема возникает, если вы пытаетесь указать полю placeholder или даже просто ввести в поле текст, потому что эту стандартную подсказку Chrome не убирает ни в том, ни в другом случае:

Для решения проблемы необходимо указать следующий CSS-стиль полю:

input[type=search] {
    -webkit-appearance: textfield; // ещё можно указать none
}
7 апреля 2013, 10:32

Поле поиск

На мой взгляд, поле поиска, которое сделал Илья Бирман в Эгее слишком перегружено:

Два значка там, где можно было обойтись одним, скругление, которое плохо выглядит в Windows.

Чтобы упростить его до того вида, который есть в моём блоге, нужно в CSS e2 дописать следующий код:

.form-search input.text { border-radius: 0px }
.form-search ::-ms-clear { display: none }
.form-search label { position: relative }
.form-search .i-loupe { background
4 апреля 2013, 11:51

Крестик очистки <inp

По-умолчанию IE начиная с десятой версии в <input> (type=text, email, url, number, tel, search) при фокусе показывает крестик для очистки содержимого поля.

Управлять им можно в CSS через конструкцию

::-ms-clear {
	...
}

Наприме