css - 如何在标题的中央垂直显示我的徽标

This question already has answers here:

How do I vertically center text with CSS? [duplicate]
                                
                                    （38个答案）
                                
                        
                        
                            Vertically align text next to an image?
                                
                                    （21个回答）
                                
                        
                        
                            How to Vertical align elements in a div?
                                
                                    （28个答案）
                                
                        
                                2年前关闭。
            
                    
我正在尝试以一种美观的方式在标题中显示此徽标。我希望它在标题中垂直显示在中心位置，但在文本左侧留有一定的间距。图像已附加。
任何帮助，将不胜感激！

header{
width:100%;
height:80px;
background-color:#76323f;
font-size:40px;
color:whitesmoke;
line-height:80px;
overflow: hidden;
white-space: nowrap;
}

.icon{
display:inline-block;
float:inherit;
width:70px;
height:80%;
margin-left:auto;
margin-right:auto;
margin-top:auto;
margin-bottom:auto;
}

<header>
     Melbourne Public Library Catalogue Site
     <img id="icon" src="Images/Icon.png" class="icon"/>
</header>

最佳答案

剩余的高度为20％。将其分成两个并用作垂直边距。

margin: 10% auto;

关于css - 如何在标题的中央垂直显示我的徽标，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/50329366/