Question

我需要帮助来将div中的链接居中。水平和垂直对齐，我不知道它是如何工作的我测试多种可能性但我失败了。

.Menu {

height:81px;
left : 0px;
right : 0px;

border:1px solid #727272;
border-radius:9px;
-webkit-border-radius:9px;
box-shadow: 1px 1px 6px #333;

background-color: #FFFFFF;

margin:5%;
vertical-align:middle;
padding-left : 25%;
}


    .Picto {
position:absolute;
left : 7%;
height:42pt;
width:42pt;
}


a {
text-decoration : none;
font-family:'HelveticaNeue-Light', 'HelveticaNeue', Helvetica, Arial, sans-serif;
font-size:36px;
color: #666;
}

html：

<a href="trav.html"><div class="Menu" style="display:none;" id="Trav"><img src="img/trav.png" alt="Travaux" class="Picto"/>Travaux</div></a>
        <a href="arbo.html"><div class="Menu" style="display:none;" id="Equi"><img src="img/arbo.png" alt="Equipements" class="Picto"/> Equipements</div></a>

提前致谢。

此致

Answer 1

试试这个

.Menu {
    height:81px;
    line-height:81px;
    text-align-center; 
  }

用于垂直对齐中间

行高和高度相同

用于水平对齐中心

使用text-align

用于图像和文本对齐中间使用

vertical-align：图像类中的中间

Answer 2

如果我在CSS中正确记得，请尝试content-align:center。这是我在每个网页中使用过的，每次都有效，而且posistion:relative而不是position:absolute

会更好

这是一个例子 http://jsfiddle.net/Lm11a0we/

如何将链接置于<div> </div>中心

2 个答案: