Как применить стили для placeholder в разных местах по разному?

Question

[азаза]

Как применить стили для placeholder в разных местах по разному?
мне нужно, что бы в разных блоках placeholder имел разные стили

::-webkit-input-placeholder
::-moz-placeholder 
:-moz-placeholder
:-ms-input-placeholder 

пытаюсь сделать так, но не работает

.block::-webkit-input-placeholder
.block::-moz-placeholder 
.block:-moz-placeholder
.block:-ms-input-placeholder

как правильно применить для определенного блока?

Comments

[posters]

Забыть про placeholder и стилизовать label?

[азаза]

posters, почему?
label не вариант

[posters]

natojezlo, он не стилизуется кроссбраузерно.
А label при грамотном позиционировании и стилизации будет выглядеть так же как placeholder, только его стилизовать можно нормально.

[posters]

natojezlo, вот. даже за вас погуглил
dnzl.ru/view_post.php?id=326
Пример специфический, но я не знаю, что вам конкретно надо. Лишь хотел показать, что label может выполнять роль placeholder. Дальше думаю сами догадаетесь как стилизовать label под себя.

[irishmann]

posters,

стерилизуется

Браузер и не должен эти заниматься :-D

[posters]

irishmann, не успел вовремя исправить) кто-то все таки заметить успел)))

[Ankhena]

posters, label и placeholder это принципиально разные вещи и одно не заменяет другого.

Answer 1

[Andrew]

.block == input? Сомневаюсь

Comments

[азаза]

нет. не работает

если прописать для общего placeholder, все работает как надо

::-webkit-input-placeholder
::-moz-placeholder 
:-moz-placeholder
:-ms-input-placeholder

но я не могу понять как прописать для определенного блока в котором placeholder

[Andrew]

natojezlo, всмысле?

[азаза]

Andrew, разобрался

Answer 2

[азаза]

все. разобрался

.block::-webkit-input-placeholder
.block::-moz-placeholder 
.block:-moz-placeholder
.block:-ms-input-placeholder

это работает
просто изначально стоит для всех placeholder

::-webkit-input-placeholder
::-moz-placeholder 
:-moz-placeholder
:-ms-input-placeholder

свои свойства

достаточно добавить !important

Comments

[WapSter]

ужас какой !important. классный атрибут, но его использование нужно сводить к абсолютному 0. В твоей задачи он вообще не нужен.

[азаза]

Тимур Турсунбаев, да я понял уже
стоял стиль для всего сайта для placegolder
без !important стиль не перебивался для определенного блока
нужно было убрать общий стиль, что бы important не применять
а почему important сводить к 0?

[WapSter]

natojezlo, много причин, если кому-то после нужно будет переделывать, самому даже при большом проекте может помешать. Если применяете не посредственно к input, то стили по умолчанию перебьются и так.

Answer 3

[Ankhena]

.block1::placeholder {
  color: #333;
}
.block1::placeholder {
  color: #999;
}

Не нужно самому писать префиксы, во-первых, потому что забыли написать основное свойство без префиксов, во-вторых, потому что для этого есть автопрефиксер (а еще лучше пакетом в сборку), который лучше вас знает каким браузерам нужны префиксы.