ckeditor / ckeditor4

The best enterprise-grade WYSIWYG editor. Fully customizable with countless features and plugins.
https://ckeditor.com/ckeditor-4
Other
5.79k stars 2.47k forks source link

Caret is hidden/disappears behind placeholder #2995

Open rgischk opened 5 years ago

rgischk commented 5 years ago

Type of report

Bug

Provide detailed reproduction steps (if any)

  1. Open the placeholder example: https://ckeditor.com/docs/ckeditor4/latest/examples/placeholder.html
  2. Click on the "Customer Name" placeholder
  3. Press the right arrow key

Expected result

The caret should be visible on the right side of the placeholder.

Actual result

The caret is not visible at all. It seems to be hidden behind the background-color of the placeholder.

Other details

I think this is the same problem as in https://dev.ckeditor.com/ticket/16723 but since that issue seems to not yet have been ported to github, I decided to create a new one. The issue is really confusing for the users, since the caret is not visible and they don't know that they can continue to type. I know its only a visual bug, not affecting the actual functionality, but it has a big impact on the usability and user experience. Would be glad if someone could look into it. A fix would be nice, if you know any workaround, let me know as well.

f1ames commented 5 years ago

Confirmed with 4.11.3 and 4.10.0. Happens only in Chrome.

In the mentioned sample - https://ckeditor.com/docs/ckeditor4/latest/examples/placeholder.html, it happens only for first 4 placeholder, the last two behaves correctly 🤔

And adding margin: 0 1px; to .cke_widget_inline seems to be solving this issue.

rgischk commented 5 years ago

Thanks, that actually works for me as well. I can use that as a workaround. From my side we can close this issue.

f1ames commented 5 years ago

I'm glad it helped @rgischk. We will leave it open for future reference and maybe try to apply a patch in CKEditor itself.