在图库中同时使用横向和纵向图像时的文本定位

Question

将fullpage.js用作水平图库我想将文本框（参见图片）与图库中的每个图像对齐。问题是不同的图像大小，当浏览器窗口大小改变时，文本不会保留在原位。

HTML

<div class="gallery-item">

    <div class="gallery-item__textbox">
        <h1>Title</h1>
        <p>Text</p>
    </div>

    <img class="gallery-item__image" src="image.png" alt="image">

</div>

CSS

.gallery-item {

    &__textbox {
        position: absolute;
        width: calc(100vw/2); // ?
        bottom: 20%;
    }

    &__image {
        margin: 0 auto;
        width: auto;
        max-height: 100%;
    }
}