Изображение CSS перемещение по размеру

Question

Изображение перемещается в положение после изменения размера окна браузера. Не знаю, почему. Может ли кто-нибудь объяснить, почему?

#me img { 
height: 200px; 
width: 200px; 
border-radius: 50%; 
left: 850px; 
position: absolute; 
} 

Answer 1

Это происходит потому, что img абсолютно позиционирован 850px влево. Таким образом, при изменении размера окна он всегда будет находиться в том же положении, что и значение px. Установка значения % сдвигает img, так как это процент, основанный на родительском объекте - в данном случае это тело, которое является изменяемым размером окна.

Посмотрите, что происходит, когда вы удаляете позиционирование: http://jsfiddle.net/JoshC/6jH9x/

Если он должен быть абсолютно позиционирован, следует рассмотреть вопрос о добавлении position:relative к родителю, что делает ребенок абсолютно позиционирован относительно родителя.