Adjusting the cursor height

v6
1

Hi :wave: ,

Great work with the CM6 editor. The more I learn about it, the more impressed I am.

Apologies if this has been asked before, but I couldn’t find it. Here’s my setup:

  • I set the line font-size: 1.2rem
  • I set the line line-height: 2.4rem

This allows for a nice padding between lines. However, the caret is still sized according to the actual text, not respecting the line-height field. The same happens with selection too:

image
image968×174 8.26 KB

However, if I expand the selection to more than two lines:

image

It fills out.

I see that the cursor size is dynamically sized? Is there a way to take into consideration the line-height?

2

The alternative — drawing a filler between a two-line selection — can look pretty weird as well, especially when it starts to the right of its end. So I haven’t really found a solution here that is always appropriate.

Measuring line height is a bit awkward in the DOM, in the presence of inline styles and line wrapping, so I’m not really sure how I’d define that.