曲線の境界線を持つ div 内に画像をレンダリングしようとしていました。両方の境界線の半径と寸法が同じであるにも関わらず、画像が div を完全に埋めないという問題が発生しています。
div内の画像をレンダリングする方法は次のとおりです
<div className={"container"}>
<img
alt={"thumb"}
className={"img"}
src={
"https://upload.wikimedia.org/wikipedia/commons/thumb/9/9a/Gull_portrait_ca_usa.jpg/300px-Gull_portrait_ca_usa.jpg"
}
/>
</div>
そしてここにcssクラスがあります
.container {
height: 32px;
width: 32px;
border-radius: 8px;
border: 1px solid grey;
}
.img {
height: 32px;
width: 32px;
border-radius: 8px;
}
ライブコードサンドボックス環境 リンクへのリンクは次のとおりです