deshiknaves / caret-pos

Locate the current position of the caret. A plain JavaScript version of Caret.js.
MIT License
117 stars 13 forks source link

Mirror "|" element is taking too much space #33

Open Glandos opened 2 years ago

Glandos commented 2 years ago

image I got the above image by debugging right after element.parentNode.insertBefore(mirror, element.nextSibling); in initializeHTML, and I add color: red; to the mirror element. I also remove the low z-index to show it.

Then we see that after the | element, text mirror has an offset. This is not a real issue here, but if the input is narrower, then the mirror is wrapping, and not the original input. Setting a max-width for this element seems to work, but I don't want to interfere with existing behavior.

Glandos commented 2 years ago

I use the following workaround:

#caret-position-marker {
  /* Workaround https://github.com/deshiknaves/caret-pos/issues/33 */
  display: inline-block !important;
  max-width: 0;
}
andreasdj commented 2 years ago

We have patched this package using patch-package and are using the zero width space character \u200b instead of the pipe |