Add support for 'object-fit' CSS property
This follows on from this question: https://community.esri.com/t5/arcgis-online-questions/map-viewer-strips-object-fit-property-for-img-...
According to this help page, the 'object-fit' CSS property is not supported in ArcGIS Online. Adding this property to the style attribute of an <img> tag gets removed from the rendered map. However, it does appear to be supported in Experience Builder as adding the exact same HTML the image is rendered in ExB as desired.
This idea is to add support for the 'object-fit' CSS property across the whole ArcGIS Online environment, as it will vastly improve the display of inline images across all applications. Example below that illustrates the problem and why I think this would be a good idea.
Original image:
ARCADE used to render this image as a 100px by 100px thumbnail:
As the image isn't square I'm trying to get the image to be cropped using the 'object-fit' property of the style attribute of the <img> tag. The relevant snippet of ARCADE code is included below:
if ($feature.thumbnailimageurl != null){
image = "<img src='" + $feature.thumbnailimageurl + "' alt='Photograph of " + studyspacename + "' width='100px' height='100px' style='float:right; padding-left:5px; overflow:clip; object-fit:cover;'/>"
}
How it displays in Map Viewer: [note the image is squashed horizontally]
How it displays in a Card Widget in Experience Builder: [note the image is not squashed at all and is cropped retaining the central section (this is what I'm trying to replicate in Map Viewer)]
