Prefer <br> over <div></div> in Editor #925


I recently updated from Ank 2.1.40 to Anki 2.1.44.
In the ChangeLog to 2.1.41 there are some Editing Improvements especially
" <br> tags will now be used by default instead of the previous <div> tags"

Is it possible to configurate which behaver should be used?
I have a lot of JavaScript functions which uses <div> tags to determine a new line / paragraph.
Currently I see no way of inserting a <div> without especially editing the HTML code.

Best regards

I assume adjusting these functions to detect <br><br> is not an option?

Not really, because I want to differentiate a new line <br> and a paragraph <div>.
Here is a example how a card is displayed and how my HTML looks like:

Step one<div>Step tow<br>New line for Step2</div><div>Step 3</div>

Bildschirmfoto vom 2021-06-07 14-07-20
Bildschirmfoto vom 2021-06-07 14-06-33

In Anki 2.1.40 I wrote this card like
Step one Hitting Enter
Step two Hitting Shift+Enter
New line for Step2 Hitting Enter
Step 3

I agree that there should be a way to differentiate between a new line and a carriage return, as there was formerly. <br> does not count as a new element, thus, a new paragraph, so things like padding, margin, and text indent do not work with <br>. This was the position I took in a similar thread:

In my case, since we can still manually edit the HTML of every note, I just work around it by adding <div> myself, and in the scenario where I need it, I just use a Keyboard Maestro macro to quickly add the HTML to selected text to save me time so that I don’t feel the “pain” of this particular change anymore, at least for my needs. But I see that this change upsets other flows such as yours as well.

If your workflow depends on enumerations like this, you could use proper lists, like <ul> or <ol>. With 2.1.44, you need an add-on like Mini Format Pack, but Anki 2.1.45 introduces buttons for these:

With lists, your paragraphs (die Zeilen, die du nacheinander aufdecken willst), will be easily separable, as each list item is wrapped like <li>Item</li>. You can easily loop through the <li> items of a particular list like this:

for (item of document.getElementById("your-list").childNodes) { /* do that thing */ }

You can then differentiate further within an item with <br>.

I get why the old behaviour would be desirable under certain circumstances (even warned on GitHub about that when the change was made), but overall, using <br> makes for much cleaner HTML within cards.

If it’s not too difficult of a change, an option to switch to that old mode (while keeping <br> as default) would definitely be something I support, because it wouldn’t harm anyone (except the dev that has to implement it :D).

1 Like

Maybe I have to use this as a workaround thank you very much.