html – Div over image Bootstrap 3

前端之家收集整理的这篇文章主要介绍了html – Div over image Bootstrap 3前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

基于http://jsfiddle.net/evJRm/(Hover image – display div over it)的片段

问题是,当窗口调整大小时,文本和图像彼此分离(图像从新行开始).我该如何解决

jsfiddle:http://jsfiddle.net/w23ch/

最佳答案
您可以更改display:inline to display:图像容器的inline-block并相应地更新定位.

高度和宽度不会影响内联元素,这使得难以获得正确的定位.

DEMO

.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;
}

猜你在找的HTML相关文章