我如何裁剪標題中多余的空間？

Question

我剛剛獲得了第一個有薪開發工作，為本地說唱歌手開發了一個網站，我非常緊張。

我目前正在研究網站徽標和導航欄，但遇到了一個問題。

到目前為止，這是我得到的：

我想要的是在橙色的“花旗B”文本頂部和底部切掉多余的空間。 擺脫掉不必要的空間后，我想將其對齊到檸檬綠div的底部。

這是所有相關代碼。

HTML：

<div class="title-wrap">
            <div class="title1">
                <h1>Citi B.</h1>
            </div>

            <div class="title2">
                <img src="img/logo.jpg" alt="Dog Logo">
            </div>
        </div>

CSS：

.title-wrap {
width: 60%;
margin: auto;
background: limegreen;
height: auto;
}

.title1, .title2 {
background: orange;
}

.title1 h1 {
font-size: 6em;
bottom: 0px;
margin: 0px;
padding: 0px;
font-family: 'Pacifico', cursive;
}

Flexbox代碼：

.title-wrap {
-webkit-flex-direction: row;
-webkit-justify-content: space-between;
-webkit-align-items: flex-end;
}

這個問題可能很容易解決，但是無論出於什么原因，我都在畫一個空白。 感謝您提供任何幫助！

Answer 1

我不明白您的問題，但我認為您的問題與頁面頂部的空間有關。
您應該知道該身體的邊緣很小，應該將其移除。 此代碼也許可以為您提供幫助。

body {
margin: 0;
}

祝好運。