Responsive images positioned over image

css, responsive-design

Solution

Set your `#counter` div to `display: inline;` or add a wrapper with `display: inline;` and set the `max-width` of `#over` to for example `10%` (DEMO):

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

Problem

I have setup a jsfiddle of what i'm trying to do: http://jsfiddle.net/MgcDU/3936/ ``` #counter { position: relative; } #over { position:absolute; left:33%; top:43%; } ``` The image of the cat is my background image which resizes as the browser resizes. The ball image is absolutely positioned over the cat. How can I get the ball image to resize and stay in the same position as it is my default?

Original source