hình ảnh Responsive vị trí trên hình ảnh

Question

tôi đã thiết lập một jsfiddle của những gì tôi đang cố gắng để làm:

http://jsfiddle.net/MgcDU/3936/

#counter { 
    position: relative; 
} 
#over { 
    position:absolute; 
    left:33%; 
    top:43%; 
} 

Hình ảnh của mèo là hình nền của tôi mà thay đổi kích thước như trình duyệt thay đổi kích thước.

Hình ảnh quả bóng được đặt hoàn toàn trên con mèo. Làm thế nào tôi có thể nhận được hình ảnh bóng để thay đổi kích thước và ở trong cùng một vị trí như nó là mặc định của tôi?

Answer 1

Đặt #counter div của bạn để display: inline; hoặc thêm một wrapper với display: inline; và thiết lập max-width của #over để ví dụ 10% (DEMO):

#counter { 
    position: relative; 
    display: inline; 
} 
#over { 
    position:absolute; 
    left:33%; 
    top:43%; 
    max-width: 10%; 
}