Reputation: 53
I am working on creating a webpage with animated images randomly positioned. My problem is that after a browser re-size images don't re-position within the container.
I have the images with absolute position and the container div with relative position. I keep seeing the image position with respect to the window rather than the parent div.
Here's a jsFiddle example of the problem I see. It has colored divs instead of images, but the problem remains. http://jsfiddle.net/HMSAM/15/
Appreciate any help in this matter. Thanks.
Upvotes: 1
Views: 1424
Reputation: 18411
You are positioning that children by setting left: #px
(pixels), and when resizing they keep that property.
If you want to recalculate the position on window resize, just use left: #%
(percent). Children will keep the value on resize, but it will mean a different "size-in-pixels".
EDIT: Or you can recalculate it, via Javascript, of course.
Upvotes: 3