Anki-android: Self-made flashcards only in bold font

[patzm]

Problem description

I created flashcards with the default Desktop environments (Linux, Windows and Mac). They contain pictures, but mostly written english text with bold, underlined and _italic_ words. They are properly displayed in the Desktop applications. However on AnkiDroid all text except for _italic_ and underlined are displayed as bold (also regular text). This does not happen with other decks downloaded form the _Shared Decks_ platform.

Example flashcard

<div><b>Survey field studies</b></div>
<div>- &nbsp;Measurement problems</div>
<div>- &nbsp;Difficulty of determining causality</div>
<div><b>Field experiments &amp; quasi-experimental studies</b></div>
<div>- &nbsp;Implementation of a participative program + other interventions</div>
<div>- &nbsp;Temporary elation</div>
<div>- &nbsp;Resentment of the “untreated”</div>
<div>- &nbsp;Difficulty of comparing different studies</div>
<div><b>Measure of participation consequences</b></div>
<div>- &nbsp;Mostly: satisfaction + performance -&gt; insensitive criterion</div>
<div>- &nbsp;Underlying influences and motivational processes were often disregarded</div>

this code seems to be valid HTML and also displays properly in an online HTML viewer

AnkiDroid badly formatted display

[hssm]

Post the Front, Back, and Styling section of your template.

[timrae]

.... or equivalently you could export a small example deck as an .apkg file and share a Google Drive or Dropbox link with us here. Also, please let us know which version of Android and Android System Webview you have on your device.

[timrae]

There are two new threads on the forum about this today as well, so I suspect it's an issue with the Android System Webview:

https://groups.google.com/forum/#!topic/anki-android/_pVfp6YLjrQ
https://groups.google.com/forum/#!topic/anki-android/y-IDGcjtBeU

[eginhard]

You need to change "font-familiy: arial;" in the card's styling section to "font-family: arial;" to fix this for your cards.

My cards (which I almost only create on AnkiDroid) had always been bold and it never seemed strange to me. At some point I saw I had a second Basic note type and cards from the one were in bold, but not for the other. I looked at the styling, but couldn't find any obvious differences and left it at that. Now I finally found the typo by going through it line by line.

[patzm]

@hssm You are right, sorry for not posting that info... Later that day I realized I forgot that.
I am using AnkiDroid 2.5 on Android 5.1.1. _Android System Webview_ is v47.0.2526.10

I found two solutions:

1. @eginhard you were totally right! This solution fixed the problem I guess the best way.
2. A small workaround, which has to be applied on all installations (e.g. different devices) is to switch the _default font_ to _OpenSans-Regular_ in the AnkiDroid settings

!

[reinert]

Thanks @patzm for the OpenSans workaround! It did the trick for me.

[cjunekim]

It seems like the bug is still there. In the cloze note type cards, all the fonts are displayed as bold, whereas with basic note type cards the fonts are normal. The css is identical between two note types.

I had to resort to @patzm's workaround -- using a different font.

[mikehardy]

Very interesting - this change https://github.com/ankidroid/Anki-Android/pull/4228 should have fixed it

I made debugging the generated HTML or webview more easy recently - if you do a debug build from current source and run it in an emulator, you should find it easy to see exactly what the HTML/CSS looks like - https://github.com/ankidroid/Anki-Android/wiki/Development-Guide#html-javascript-inspection.

The Android Studio and emulator downloads are very large, but the setup and build on the same really aren't that hard if you want to give it a try