hình ảnh trung tâm theo chiều dọc/chiều ngang trên hình khác mà không có kích thước

Question

Tôi đang cố gắng làm cho hình ảnh xuất hiện để có nút phát nằm ở giữa. Tuy nhiên, tôi sẽ không biết kích thước chính xác của hình ảnh chính vì nó được tạo động.

Ngay bây giờ, hình ảnh lớp phủ (nút phát) nằm ở góc trên bên trái. Làm cách nào để nút phát hiển thị ở giữa theo chiều ngang và chiều dọc?

Cảm ơn bạn.

<div class="videobox"> 
<img src="/mainimage.png"> 
<span></span> 
</div> 

.videobox { position: relative; } 

.videobox span { 
position:absolute; 
left: 0px; 
bottom: 0px; 
width: 100%; 
height: 100%; 
z-index: 1; 
background: transparent url(../img/elements/playbutton.png) no-repeat; 
} 

Answer 1

.videobox span { 
    display: block; 
    position: absolute; 
    top: 0; 
    left: 0; 
    bottom: 0; 
    right: 0; 
    z-index: 1; 
    background: url(../img/elements/playbutton.png) no-repeat center center; 
}