基于http://jsfiddle.net/evJRm/(Hover image – display div over it)的片段
问题是,当窗口调整大小时,文本和图像彼此分离(图像从新行开始).我该如何解决?
jsfiddle:http://jsfiddle.net/w23ch/
最佳答案
您可以更改display:inline to display:图像容器的inline-block并相应地更新定位.
高度和宽度不会影响内联元素,这使得难以获得正确的定位.
.img-container{
width:150px;
height:225px;
position: relative;
display: inline-block;
margin:5px;
}
.img-text{
top:50%;
width:150px;
height:50px;
margin-top: -25px;
position: absolute;
background-color: yellow;
display:block;
}