В чем отличие значении в margin?

Question

[fraqlehver]

Я учу вёрстку и не могу кое чего понять. Я вставил фотографию и после дал ей класс в котором дал ширину и сделал его блочным элементом. но теперь у меня вопрос в чём отличие между строками:
margin: 0 50%;
и
margin: 0 auto;

я хочу поставить фото по середине и знаю что при auto оно стоит ровно по середине только почему с 50% это так не работает?(прошу помочь с понятием в их отличии, а не тем как можно поставить картину по середине)

Answer 1

[Тимофей]

50% задаст margin 50% от длинны родителя, а auto автоматически подберет отступы :)
Если ваш родитель 1000px, margin 50% будет составлять 500 px слева и справа. Но есть еще ваш целевой див, вот если ему задать width 0px то все будет ровно по центру :)

Comments

[fraqlehver]

ну так если задали 50% почему картинка у меня не по центру
я ща подумал и вот что надумал.
если картинке дают отступ 50%, то от левой стороны она будет находится на 50% ширины экрана а отступ правой стороны будет меньше из-за размера картинки?

[Тимофей]

fraqlehver, Если ваш родитель 1000px, margin 50% будет 500px слева и справа. И еще ваш див у которого задан margin тоже имеет размер, к примеру 200px, итого 1200px. Но ваш родитель всего 1000px. Получается у вас лишние 200px.

[fraqlehver]

а куда денутся 200 пикселей?

[Тимофей]

fraqlehver, справа margin станет всего 300px вместо нужных 500. Но это все образно, при изменении размеров кривость верстки будет меняться

[fraqlehver]

Тимофей, спасибо терь понял