-1
Поскольку я анимировал свои изображения (надпись появляется при зависании), изображения стека вертикально, а не горизонтально, если смотреть в Chrome. Вот URL-адрес: http://goodyearsinc.com/releasesСнимки изображений при анимации
Я попытался добавить «float: left» в img wrap, который работал на Firefox, но не в Chrome. Я вытаскиваю свои волосы, пытаясь разобраться.
Вот jsfiddle с помощью CSS - http://jsfiddle.net/8eTB2/
.item1, .item2, .item3, .item4
{
float:left;
}
.img-wrap{
height:150px;
overflow:hidden;
position:relative;
float: left;
margin-right: 5px;
}
.img-overlay{
background-color:#000;
bottom:0;
color:#fff;
opacity:0;
filter: alpha(opacity = 0);
position:absolute;
width:100%;
z-index:1000;
}
.img-overlay h4, .img-overlay p{
padding:0 10px;
}
.img-wrap:hover .img-overlay{
opacity:0.75;
filter: alpha(opacity = 75);
transition:opacity 0.25s;
-moz-transition:opacity 0.25s;
-webkit-transition:opacity 0.25s;
}
Добро пожаловать в Stackoverflow, пожалуйста, предоставьте нам свой код, который имеет отношение к проблеме. –
Извините, я новичок в Stackoverflow. Я отредактировал свой ответ с соответствующим css. Больше не повторится :) – user3006089
Для будущих ссылок отправьте только код, имеющий отношение к проблеме. Если у вас много полезного кода, вы можете использовать этот отличный инструмент, http://jsfiddle.net/. –