/ 

Код. Плейсхолдер для [contenteditable]

Я уже сильно привык к аттрибуту placeholder, и немного грустил зная что <pre contenteditable></pre> не работает с placeholder. Но чутка погуглив я нашел инетресное решение, которым хочу поделиться с вами.

[contenteditable]:empty:before {
    display: block;
    color: #999;
    content: attr(placeholder);
}

Пример

На случай если вы не видите примера выше — ссылка на JS Fiddle.

Будьте осторожны с contenteditable, его поведение разнится в браузерах. В сафари если удалить весь текст в поле все равно остается <br> и :empty не страбатывает.

⌘ ⌘ ⌘
Поделиться
Отправить
Как называть переменные
Фронтенд

Как называть переменные

Мой взгляд на соглашения наименования переменных, функций, методов и классов

Плавный, нативный скрол
Фронтенд

Плавный, нативный скрол

Выкиньте лишние библиотеки для прокрутки внутри страницы

Лайфхак. Номер телефона на сайте
Фронтенд

Лайфхак. Номер телефона на сайте

Надоели звонки от клиентов в 2 часа ночи? Покажите номер телефона на сайте только в рабочее время. Подробности в статье.

На чем тестировать JavaScript фреймворки
Фронтенд

На чем тестировать JavaScript фреймворки

На чем испробовать новую технологию или фреймоврк если нет сайд/пет проекта? Пара интересных задачек в этой заметке.