小编BoJ*_*ack的帖子

当我使用 Flexbox 将内容居中时，我总是遇到这个问题，其中我的按钮最终跨越了 div 的整个宽度。我希望它只占用它需要的空间。

代码：

HTML：

                    <div class="who__text-content">
                        <h2 class="u-margin-bottom-2">Who</h2>
                        <h2 class="u-margin-left-2 u-margin-bottom-2">Lorem ipsum</h2>
                        <p class="u-margin-left-2 u-margin-bottom-6">Lorem ipsum</p>
                        <a href="#" class="btn u-margin-left-2">Meet The Team</a>
                    </div>

萨斯：

.btn {
    padding: 1.3rem 3.7rem;
    width: auto;
}

.who {
    &__text-content {
        padding-bottom: 1.3rem;
        display: inline-flex;
        flex-direction: column;
        justify-content: center;
        align-content: center;
        margin: auto;
        height: 100%;
        <!-- I tried using the code bellow instead of the code above with position: relative; on the parent element. It ensures the button doesn't span the fullwidth …