Our image scales are confusing

Finally we ended up he having 3 scale types in our image scaling module:

  • scale (former aka keep, thumbnail)
  • cover (former aka scale-crop-to-fill, up)
  • contain (former aka scale-crop-to-fit, down

Our description from the docstring is:

  • scale: Scales to the requested dimensions without cropping. The resulting image may have a different size than requested. This option requires both, width and height, to be specified. Does not scale up.
  • cover: "Scales the relatively largest dimension up to the required size. Despite the alternative spelling, I see no cropping happening."
  • contain: "Starts by scaling the relatively smallest dimension to the required size and crops the other dimension if needed."

Now, compare this to the css-backgroundsize.

  • cover: Scales the image (while preserving its ratio) to the smallest possible size to fill the container (that is: both its height and width completely cover the container), leaving no empty space. [...]
  • contain: Scales the image as large as possible within its container without cropping or stretching the image. [...]

As you see it is used the opposite in CSS. IMO our definition is confusing and the CSS one is fine. Ours is semantically wrong. Should we better fix this?

Slightly off topic, but it is possible to use the same for images (not background size) by using CSS's object-fit. I prefer this, since one does not need to 'change html'.

UPDATE: I wanted to mention this, since it can be used as an alternative way of using scales (by cropping them in CSS instead, which is often useful when making responsive design)