How to center large images on Anki?

Anki Card Design
1

I’m trying to add my lectures notes to Anki and enlarge the images.

This is my current code:
/* IMAGE STYLE */

img {display: block; max-width: 200%; max-height: none; margin: 10px auto 10px auto; margin-left: auto; text-align: center;}

tr {font-size: 12px}

However, the output for this code is as follows:

Screenshot 2025-02-13 at 12.30.05 PM
Screenshot 2025-02-13 at 12.30.05 PM1920×1091 127 KB

Is there a way to center the image on the Anki card? I tried everything. I even tried copying the code into AI to have it centered but the image is not centering. It’s always going to the right.

I don’t want to make it smaller because I want to be able to read the slides. Is there a way to edit the styling to make sure all images are centered? Maybe, it’s a left margin issue?

2

Yes, it is possible. I have done it in my own card templates and it works on (at least) Desktop and Android.

It would be helpful to have your html (front and back) and css in three separate codeblocks, because otherwise the site might eat some formatting.

You can do a block like this:
```
My code goes here
```

1 Like
3

I’ve written a way to zoom and pan images when reviewing. I’m not sure this helps you, but I really needed this when I first used Anki.

1 Like