-
Notifications
You must be signed in to change notification settings - Fork 1.8k
Open
Labels
project:react-native-webIssue associated with react-native-webIssue associated with react-native-web
Milestone
Description
Is your feature request related to a problem? Please describe.
I'm trying to have an image that keeps its aspect ratio while resizing to fit inside a container with a maxHeight style. Using resizeMode of contain works, but the element takes up all of the space even though the image is centered, since it's being centered as a background. This means the white space around the image that fills the container is still considered part of the image (you can right click the white space and save the image).
Describe a solution you'd like
An implementation of the contain resizeMode that keeps the element (and the hidden accessibilityImage) sized to the visible image, instead of taking up the entire space.
Describe alternatives you've considered
- I got it to work with the
aspectRatiostyle, but unfortunatelyaspect-ratiohas only recently gained browser support, so I can't use it yet. - Since browsers use the img width/height attributes to calculate an aspect ratio, perhaps setting those attributes could be part of the solution?
- I'm currently trying to just use the padding trick to preserve the aspect ratio, but I'm not having any luck.
Metadata
Metadata
Assignees
Labels
project:react-native-webIssue associated with react-native-webIssue associated with react-native-web