search

elad2412 / the-new-css-reset

The New Simple and Lighter CSS Reset
https://elad2412.github.io/the-new-css-reset/
MIT License
2.26k stars 229 forks source link

Invisible caret in `contenteditable` with Firefox #14

Closed tienpv222 closed 3 years ago

tienpv222 commented 3 years ago

Reproduce: https://codepen.io/pynnl/pen/VwzOLpx

Tested on:

It works fine on Chrome. However on Firefox, the caret is invisible although the element is still editable.

TheFakeCake commented 3 years ago

I did some digging and found the -moz-user-modify custom property of Firefox: https://developer.mozilla.org/en-US/docs/Web/CSS/user-modify

I tried using it with the revert value without success, but setting it with read-write works:

:where([contenteditable]) {
  -moz-user-modify: read-write;
}

I am not sure this is the property that causes the bug though, since -moz-user-modify: revert; does nothing. Also I did not test this thoroughly.

The MDN doc states:

Warning: This property has been replaced by the contenteditable attribute.

elad2412 commented 3 years ago

Updated in the new version 1.4.1

Thanks for the update!