Skip to content

Commit

Permalink
docs: image sizing w/ both maxWidth maxHeight set
Browse files Browse the repository at this point in the history
  • Loading branch information
benedictjohannes authored Feb 29, 2020
1 parent 770c90c commit 387c8b3
Showing 1 changed file with 1 addition and 1 deletion.
2 changes: 1 addition & 1 deletion packages/gatsby-plugin-sharp/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -101,7 +101,7 @@ a base64 image to use as a placeholder) you need to implement the "blur up"
technique popularized by Medium and Facebook (and also available as a Gatsby
plugin for Markdown content as gatsby-remark-images).

When both a `maxWidth` and `maxHeight` are provided, sharp will use `COVER` as a fit strategy by default. This might not be ideal so you can now choose between `COVER`, `CONTAIN` and `FILL` as a fit strategy. To see them in action the [CSS property object-fit](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit) comes close to its implementation.
When both a `maxWidth` and `maxHeight` are provided, sharp will use `COVER` as a fit strategy by default. This might not be ideal so you can now choose between `COVER`, `CONTAIN` and `FILL` as a fit strategy. To see them in action the [CSS property object-fit](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit) comes close to its implementation. The image will be cropped to aspect ratio of `maxWidth` and `maxHeight`, with sizes calculated using `maxWidth` respecting `srcSetBreakpoints`.

#### Note

Expand Down

1 comment on commit 387c8b3

@benedictjohannes
Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Address #11851

Please sign in to comment.