Css 垂直对齐不同大小的文本

我有两段文字。一个向左对齐，另一个向右对齐。左边的那个比右边的大。如何使它们彼此垂直居中对齐

---

我将属性

align items:baseline

添加到包装类中，这似乎完成了工作。

只需在保存这两个元素的外部div上添加一个align items中心

<section role="outer" class="bg-cover section section-fullWidthContent position-relative first">
    <div class="container">
        <div class="d-flex align-items-center">
            <div>
                <h1 class="section-title">Title</h1>
            </div>
            <div class="ml-auto">
                <a href="" class="text-md-right"><h1 class="xsmall-title">See All</h1></a>
            </div>
        </div>
        <hr/>
    </div>
</section>

头衔

试试这个

。章节标题{
字号：900；
文本转换：大写；
}
.xsmall标题{
字体大小：400；
字体大小：1.3em；
文本转换：大写；
}

头衔

.section-title {
    font-weight: 900;
    text-transform: uppercase;
}

.xsmall-title {
    font-weight: 400;
    font-size: 1.3em;
    text-transform: uppercase;

}

<section role="outer" class="bg-cover section section-fullWidthContent position-relative first">
    <div class="container">
        <div class="d-flex align-items-center">
            <div>
                <h1 class="section-title">Title</h1>
            </div>
            <div class="ml-auto">
                <a href="" class="text-md-right"><h1 class="xsmall-title">See All</h1></a>
            </div>
        </div>
        <hr/>
    </div>
</section>