"Backspace" not working for span tag

[spechtjonas]

• [x] I've updated this add-on to the latest version
• [x] I've tried disabling all other add-ons except this one.

Describe the bug When editing a field using the span tag in the option, "backspace" doesn't work to delete letters. "Del" works fine, adding letters is also not an issue.

To Reproduce

1. Use any note type
2. Enable the add-on as described on the add-on page
3. Choose span as tag
4. Edit any entry in any field

Further Information I use a german keyboard. I use the span tag, as with the div tag fields that are embeded in a sentence will create a line break before and after the fields content. Using div is therefore not an option, unless there is a work-around for this issue. Also, further support oft the tags option, especially span, would be highly appreciated for that reason.

[BlueGreenMagick]

For now, switch to div and try putting this in the note type styling:

div[data-efdrcfield] {
    display: inline-block;
}

I'll eventually make the add-on use this instead of using span for inline. The backspace bug seems to be caused by either Anki or the web browser engine, thus not easily fixable from my add-on.

[spechtjonas]

Thanks for the idea. After some more experimentation I settlet on

div[data-efdrcfield] { display: inline; margin-right: -4px; margin-left: -4px; }

for now.

This resolves issues with line breaks that arise, when using inline-block and having to much content in the field to fit in one line.

The negative margins remove the spacing infront and after the content of a field which is normally displayed for inline elements (as far is I got to know by quick research). Numbers might need adjustment based on font size used.

This will not work with the text-fields of Cloze Overlapper.

[BlueGreenMagick]

I'll leave it open since it's not exactly "fixed". Else I'll definitely forget about it in the future!

[spechtjonas]

Actually, I found some (to me) weird behavior to add to this.

When using display:inline for the div element, it's displayed properly, whenever there are words (or letters for that matter) infront and behind the field. However, when there a special charakters or punctiuation (e.g. " oder ?) infront or behind the fields content, a 4-5px gap will be added.

For instance, "Whats the definition of {{edit:word}}?" would show as "What's the definition of word ?", creating a space between the replaced word and the question mark, but not between "of" and "word". If you were to put a special character infront there would be a space to.

This is the case for the reviewer, it's all displayed properly in Preview and the preview in the template editor.

Just letting you know, maybe that's of interest.