We have added a Santa image to our home page, to go with the Season.
We would like this Santa image to be within 25% to 75% of center on the right and -25% to -75% of center on the left. You can see what I mean here:
We are using:
position: absolute; margin-top: 10em; margin-left: xem;
with x dynamically generated by PhP. But we are not getting the desire effect exactly as the Santa image is sometimes too close to center and sometimes off the screen on left & right.
I think the inconsistent place of the Santa image could be that it relies on its left and top auto coordinates. It is a good idea to move the image by margins, but it will move referring to the auto position that could shift depending circumstances, see @PaulOB’s thread : dcode-understanding-css-positioning
Give Santa the coordinates for the margins to move from, and also give the parent container a position to refer the coordinates to.