2

Why selector input:read-only, input:-moz-read-only won't work on Google Chrome? Works only, if I write it as two separate selectors input:read-only, input:-moz-read-only with same instruction.

input:read-only,
input:-moz-read-only {
  border: 1px solid red;
}


/* Works if i will repeat it separate, like below */


/* input:read-only {
    border: 1px solid red;
} */
<input type="text" name="" value="Read-only" id="" readonly>
j08691
  • 204,283
  • 31
  • 260
  • 272
Paweł Gargula
  • 34
  • 4
  • 1
    Note that Firefox doesn't need the `-moz-` prefix – j08691 Aug 02 '22 at 17:31
  • 2
    And you can't combine vendor prefixed selectors. Separate them. – Paulie_D Aug 02 '22 at 18:18
  • Thanks for comments, you are right. Btw I asked about it, because [mdn site about :read-only](https://developer.mozilla.org/en-US/docs/Web/CSS/:read-only#confirming_form_information_in_read-onlyread-write_controls) shows this selector as an example. – Paweł Gargula Aug 02 '22 at 19:12

1 Answers1

-1

As @Paulie_D said, "... you can't combine vendor prefixed selectors. Separate them.". Similar question was already answered on stackoverflow. I close the question.

Paweł Gargula
  • 34
  • 4