css 另一个元素中的中心元素

Posted 2021-05-13

        <header class="header">
                <div class="logo-box">
                    <img src="img/logo-white.png" alt="Logo" class="logo">
                </div>
                
                <div class="text-box">
                    <h1 class="heading-primary">
                            <span class="heading-primary-main">Outdoors</span>
                            <span class="heading-primary-sub">is where life happens</span>
                    </h1>
                </div>
               

        </header>

.text-box {
    position: absolute;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -50%)
}