Skip to content

Commit

Permalink
Update image.mdx (#66618)
Browse files Browse the repository at this point in the history
Using `overflow: hidden` on the image's parent element is not necessary,
as the image is already set to be the same dimensions as its parent with
no overflow, and `object-fit` only changes the image aspect ratio & crop
within those dimensions.

Co-authored-by: Steven <steven@ceriously.com>
  • Loading branch information
chrisjstott and styfle authored Jun 6, 2024
1 parent 31222b5 commit a1eead8
Showing 1 changed file with 1 addition and 1 deletion.
2 changes: 1 addition & 1 deletion docs/02-app/02-api-reference/01-components/image.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -197,7 +197,7 @@ By default, the img element will automatically be assigned the `position: "absol

If no styles are applied to the image, the image will stretch to fit the container. You may prefer to set `object-fit: "contain"` for an image which is letterboxed to fit the container and preserve aspect ratio.

Alternatively, `object-fit: "cover"` will cause the image to fill the entire container and be cropped to preserve aspect ratio. For this to look correct, the `overflow: "hidden"` style should be assigned to the parent element.
Alternatively, `object-fit: "cover"` will cause the image to fill the entire container and be cropped to preserve aspect ratio.

For more information, see also:

Expand Down

0 comments on commit a1eead8

Please sign in to comment.