Как выровнять заголовок по середине клетки контейнера, чтобы он при этом занимал его полностью?

Странная штука. Пытаюсь выровнять заголовок по середине контейнера, уже все перепробовал. Отключил марджин, включал паддинг и все равно фигня какая-то. Либо фон идет только строкой, а не распространяется по всему контейнеру, либо заголовок упирается в левый верхний угол, а сам блок съезжает ниже контейнера. Как сделать, чтобы заголовок был по середине, при это вся клетка была с оранжевым фоном ?

введите сюда описание изображения

введите сюда описание изображения

.android {
justify-self: end;

&-wrapper {
    width: 440px;
    height: 290px;

    display: grid;
    grid-template-rows: repeat(3, 1fr);

    border: 4px solid $desert-sand;

    overflow: hidden;

    img {
        max-width: 170px;
        max-height: 170px;

        grid-row: 1/3;
        justify-self: center;
    }

    h2 {
        margin: 0;

        grid-row: 3/4;
        align-self: center;

        background-color: $desert-sand;
        height: 100%;
    }
}

}


Ответы (0 шт):