object-fit:cover; で object-position: 50% 50%;が効かない

こんにちは　FULL Web Designの渡邊です。

今バタバタしているので、メモ書きます。

object-fit:cover;を使った時に、いつもobject-position: 50% 39%; とかに変えて、画像の場所を変えています。

しかし、今回、swiper内の画像に適応したら、うまく　object-position　が効いてくれません。

たまたま適応させたいときが、画面をいっぱいに開いた時に大きくなりすぎないときの場所だったのですが、

そこでの成功事例を書いておきます。

画像のcss

    img{width: 100%;
        height: 100%;

        object-position: 50% 50%;
        object-fit:cover;
}

親のcss

height:  635px;

親に高さを指定すればできました。

親に高さを指定しないと、できませんでした。

しかし、他で使っている要素のときに、

親の高さを指定していなくても,効いたので、そちらを確認すると、

そちらは画像が

postion:absolte 　top:0 になっていて、機能しました。

また、top:0がないとうまく機能しませんでした。

{
position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 50%;
    z-index: 0;
    top: 0;
}

誰かの参考になればです。