In the next/image docs under version history, it states the following for v13.0.0:
layout, objectFit, objectPosition, lazyBoundary, lazyRoot props removed.
Under next/image docs for fill the documentation states we can set the object fit with object-fit: "contain"
or alternatively to object-fit: "cover"
. I am unable to set the object fit to cover with the following code:
<div className="relative">
<Image
src=""
alt=""
fill={true}
layout="fill"
object-fit="cover"
/>
</div>
How does one implement object-fit with Next.js 13?
NextJS Image component now supports style prop so I believe this is the right answer:
<div style={{position:"relative"}}>
<Image
src={source}
alt=""
fill
style={{objectFit:"cover"}}
/>
</div>
Parent container is relatively positioned.