Images on Cards options

[JeffBurrows]

Unless I'm missing something, when you design a "card" and specify where the image should be, you can't customize the way the image gets rendered.

In HTML, when you have an image in a container, you can say how you want the image to resize (or not), what coordinates you want it to align from, etc.

All of these CSS options really need to be accessible when you design a card!

[rperez_bonnier]

Many agree. I thought this was on the road map.

[Bob_Bringhurst_]

Right now, the card image is cropped, centered, and scaled to fill the image area of the card. I don't know when we'll offer more control over how the image is displayed within the card. Perhaps someone else will chime in.

[JeffBurrows]

Among other things, if you use an article in more than one collection, and that collections use different templates, your image will look wrong in one of them.

Similarly, if you use a different template for phones and tablets, the original image will look wrong in one of them.

The arbitrary "cropped, centered, and scaled" is not a good solution.

Again, if I am missing some effective work-around for this, please let us know!

[andreig1004688]

Hi,

We indeed are planning to provide better control for image cropping.

JeffBurrows‌ , besides the already available center cropping, what other cropping options you'd want to use on cards?

Thanks,
Andrei

[JeffBurrows]

At the very least:

Align Options:  top-left, top-center, or absolute center

Scale Options: fit-to-height, fit-to-width, fit all, specify percent, or none

Crop Options: would be determined by scale setting

These are the things that the average web designer can do with CSS.

Another option would be: have an "advanced" which would just let the user enter the CSS that should be applied...