Html 在可调整大小的div中垂直居中键入

我知道这个问题已经被回答了一千遍，但我发现似乎没有任何效果。我有一张全宽的图片，可以通过导航窗口调整大小。然后我在中间有一个框，里面有文本。图像框和类型正在按预期调整大小，但我似乎无法使类型以多行文本为中心。这是我的HTML：

<div class="block-full">
    <div class="info-box-full">
        <div class="slide-info">
            <span><?php echo $ss_slide_post_title?><br><?php echo $ss_slide_post_desc;?></span>
        </div>
    </div>
<img src="<?php echo $image_link[0];?>" alt="">
</div>

谢谢你的帮助

您需要的是html标记内的style=“text align:center”，这将根据容器的大小相对地将标记内的所有文本居中

使用Flexbox

浏览器支持：

快速启动：

*{margin:0；padding:0}
身材{
显示器：flex；
背景：url（'http://i.imgur.com/urlCI95.jpg');
背景尺寸：封面；
高度：200px；
}
菲卡普顿{
颜色：白色；
文本对齐：居中；
保证金：自动；
}

垂直居中文本。

.block-full {
    height: 0;
    overflow: hidden;
    padding-bottom: 45%;
    position: relative;
    text-align: center;
    width: 100%;
}
.info-box-full {
    background-color: rgba(255, 255, 255, 0.8);
    height: 26%;
    margin-left: 40%;
    position: absolute;
    top: 37%;
    vertical-align: middle;
    width: 20%;
    z-index: 9999;
}
.slide-info {
    font-size: 1vw;
    line-height: 1;
    margin-top: 25%;
    text-align: center;
}
span {
    display: inline-block;
    line-height: normal;
    vertical-align: middle;
}