既存の CSS の改修で少々ハマったので備忘録です。
:read-only: 属性を指定してない要素にもスタイルが適用される場合がある[readonly]: 属性を指定した要素のみスタイルが適用される
ざっくり input 要素などに :read-onlyのスタイルを適用する場合は、.my-class[readonly]を対象にするなどにした方が良さそう。
// 主なスタイル適用対象
<inputclass="input-class"type="text"readonly>
// WARNING: `:read-only` のスタイルは以下にも適用される
<inputclass="input-class"type="submit"value="送信"><inputclass="input-class"type="file">意図しないスタイル適用を防ぐため、[readonly]の利用をお勧めします。