如何在不改变导航栏（Navbar）高度的前提下调整Logo尺寸？

我想要放大导航栏中的Logo，但调整其width属性时，Logo变大的同时导航栏高度也会随之增加。我希望保持导航栏原有高度，让Logo更好地适配它。

原始导航栏CSS代码 #

#navbar {
    box-shadow: 0px 6px 10px #777;
}

#navbar a:hover {
    color: #7a7a7a;
}

#navbar a {
    color: #FFF;
}

.navbar-brand {
    display: flex;
}

.navbar-brand img {
    width: 40px;
}

.navbar-brand span {
    font-weight: 700;
    font-size: 1.5em;
    margin-left: 0.5em;
    color: #FFF;
}

#navbar-items .navbar-nav {
    display: flex;
    justify-content: center;
    width: 100%;
}

#navbar-items .nav-item {
    margin: 0 1em;
}

原始导航栏效果 #

解决方法及修改后代码 #

我为.navbar-brand添加了position: absolute属性，之后调整width让Logo适配导航栏，同时重新保存了放大后的Logo以保证清晰度。修改后的CSS代码如下：

.navbar-brand {
    display: flex;
    position: absolute;   
}

.navbar-brand img {
    width: 95px;
}

调整后的效果 #

内容的提问来源于stack exchange，提问作者Davi Machado