Кнопка Play на картинках (псевдоселекторы). Как добавить?

[iBars]

Кнопки не видно

img.playvid {position: relative;}img.playvid:before {display: block;content: "";background: url(http://derka.pickupguild.ru/images/play.png) no-repeat center center;position: absolute;top: 45%;left: 0;right: 0;width: 64px;height: 64px;z-index: 99;}

Если что, все img заключены в div. Может для него можно что-то прописать, если не получится?

[by chris]

left: calc(50% - 32px);

[by chris]

.parent-div {

position: relative;

}

.parent-div::before {

position: absolute;

z-index: 99;

top: 45%;

right: 0;

left: 0;

display: block;

width: 64px;

height: 64px;

content: '';

background: url(http://derka.pickupguild.ru/images/play.png) no-repeat center center;

}

img.playvid {

visibility: hidden;

}

[iBars]

Не работает. Вот страница, по Ctrl+F введите "бабочка". На той картинке должна быть картинка Play

[iBars]

Спасибо! Заодно узнал что в CSS таки есть высчитывание размеров

[iBars]

Последний вопрос. Сделал чтобы при наведении заливалось красным (при помощи background-position), но в IE этого не происходит. Не посмотрите? Ссылка двумя постами выше

[by chris]

/*left: calc(50% - 32px);*/left: 50%;;

Обрезается код

 

После left, Маржин-лефт минус 32пкс.

Edited March 7, 2016 by by chris