将徽标与页眉中心对齐 [英] Align Logo at center of Header

问题描述

我试图居中对齐我的屏幕的 Logo ，但无法完成.请帮忙.

I'm trying to center align my Logo of my screen but not able to accomplish. Please help.

HTML

<!-- Header Start -->
<div class="MastHead" data-role="header" data-position="fixed" data-tap-toggle="false">
<div class="HeaderLft"><a href="#dashboard" data-transition="slide" data-direction="reverse"><img alt="" title="" src="images/top_lft_arrow.png"  /></a></div>
<div class="HeaderRgt"><div class="TopRedBox"><a href="#" data-rel="back" data-transition="slide" data-direction="reverse" id=saveFav>Save</a></div></div>
<div class="HeaderLogo">LOGO</div>
</div>
 <!-- Header Ends -->

CSS

.HeaderLogo 
{
    position: absolute;
    margin:0 auto;
    width: 100px;
    top:10px;
}

推荐答案

2种可能性:

   .HeaderLogo {
    width: 100%;
    text-align: center;
}

或

html

<div class="HeaderLogoWrapper"><div class="HeaderLogo">LOGO</div></div>

css

.HeaderLogoWraper {
    margin: 0 auto;
    text-align: center;
    width: 100%;
}

这篇关于将徽标与页眉中心对齐的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！