Html 非常基本的高度问题
我在div旁边有一个图像,旁边有一个超链接。问题是超链接显示在图像的底部。我想在图像的中心显示它 HTML:Html 非常基本的高度问题,html,css,Html,Css,我在div旁边有一个图像,旁边有一个超链接。问题是超链接显示在图像的底部。我想在图像的中心显示它 HTML: <div class="main"> <img class="image" src="http://aux.iconpedia.net/uploads/16149178162137949115.png" alt="smiley" /> <a class="link" href="#">move it up in the center to the sm
<div class="main">
<img class="image" src="http://aux.iconpedia.net/uploads/16149178162137949115.png" alt="smiley" />
<a class="link" href="#">move it up in the center to the smiley</a>
</div>
.main{
border:1px solid red;
}
.image{
border:1px solid green;
}
.link{
/*height:30px;*/
}
JSFiddle:
<div class="main">
<img class="image" src="http://aux.iconpedia.net/uploads/16149178162137949115.png" alt="smiley" />
<a class="link" href="#">move it up in the center to the smiley</a>
</div>
.main{
border:1px solid red;
}
.image{
border:1px solid green;
}
.link{
/*height:30px;*/
}
给你
.main{
border:1px solid red;
}
.image{
border:1px solid green;
position:absolute;
}
.link{
line-height:65px;
position:relative;
}
将图像的位置设置为绝对意味着任何元素都将漂浮在其上。然后在文本/链接设置上,行高基本上是高度,因此我们匹配图像高度。将文本/链接位置设置为相对位置也很好,以确保它也能在IE中工作。可能的重复