Fit image to window/app

Anki Help
1

sorry if this has been answered - i cant find it !!

so i’ve just started with anki, making a deck (on my linux laptop), for use be me and my son on our phones…

I used some images with labels to study. what i cant get into my thick head is how to auto size the images. Its frustrating to the point of giving up that we have to scroll each and every card !!! i’ve seen ImageResizer addon, but doesnt seem to work with existing cards, and i have to kkep guessing screen sizes for various devices… three days i’ve been fighting with this…

tl,dr: how do i make an image fit the window/app by height, to avoid scrolling ???

please, anyone got an idiots guide for this ?!?!?!

2

add this to your card styling:
img {max-height: 500px}
you can change 500 to whatever value you want

1 Like
3

Thanks, but that doesnt answer my problem. If i make max-height say 200 so it fits nicely on the phone, its too small on the tablet and laptop…

4

you can use % instead of px
but the % only works on width for me, don’t know why (scales the whole images down tho).
try using this:
img {width: 50%}
you can change 50 till you find the number that works best for all of your devices

5

You can also use this:
.mobile img{height: 200px}
So the changes would not affect other platforms

2 Likes
6

Thanks. i give it a try.
i have just discovered that the max-height doesnt work at all on AnkiDroid (phone). :frowning:

trying it now…

7

This last one works on ankidroid too.
Just thought of it rn, tested it on ankidroid.

8

Fantastic. Its all working great.
Now to build up a new deck (exciting times!)
Thanks you so much.

summary:
anki - browse - select card - click Cards - Styling (shared) . . .
/* GENERAL CARD STYLE */
.mobile img{height: 300px}
img {max-height: 400px}
close window, remember to press Sync !!

9

no probelm :slight_smile: