1

Estou tentando fazer com que eu possa ter diversos tipos de placeholder com base em uma classe definida assim:

.red,
.red::-webkit-input-placeholder,
.red:-moz-placeholder,
.red::-moz-placeholder,
.red:-ms-input-placeholder{
    color:red
}

O problema é que se eu defino dessa forma ele não funciona, não consigo entender porque não posso estilizar inúmeros elementos junto do CSS quando se trata do placeholder... alguém tem uma luz?

EDIT

Eu percebi que se eu declarar cada seletor separado ele funciona, mas não fica "bonito" de se ver quando se está criando os códigos. Assim:

.red {
    color: red;
}

    .red::-webkit-input-placeholder {
        color: red;
    }

    .red:-moz-placeholder {
        color: red;
    }

    .red::-moz-placeholder {
        color: #fff !important;
    }

    .red:-ms-input-placeholder {
        color: #fff !important;
    }
0

1 Resposta 1

3

Que bom que conseguiu resolver o problema sozinho.

A única solução que encontrei até hoje foi utilizando esse método de declarar as regras separadamente.

Acredito que isso seja necessário porque quando o browser não reconhece um seletor ele ignora toda a regra. Portanto quando o webkit não reconhece o seletor do firefox ele ignora a regra CSS, e o oposto também é verdadeiro.

1

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .