7 заметок с тегом

верстка

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
}
4 июля 2014, 23:31

Минимальный UI в Safa

С помощью <meta>-тега viewport можно сделать так, чтобы адресная строка браузера в Сафари, а также нижняя панель с кнопками была по-умолчанию скрыта:

Для этого в значение тега через запятую допишите minimal-ui, вот так:

<meta name="viewport" content="width=device-width, init
6 июня 2013, 9:10

Глюк в Chrome с Flash-ба

В случае, когда у вас Flash-баннера на сайте в хроме загружаются «через раз» (хотя всё, вроде бы, корректно), вам поможет следующий код:

if (navigator.userAgent.match(/chrome/i)) {
	var objects = document.querySelectorAll("object");
	for (var i in objects)
		if (objects[i].parentNode)
			object
15 мая 2013, 16:37

Всплываю

На сайтах всплывающие слои с полезной информацией должны быть доступны по прямому URL с хэшем.
Вот, на

чтобы любой посетитель, который того пожелает, мог скачать и сохранить ваш логотип, а затем ис

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 {
	...
}

Наприме