У меня есть div вложенный в другой div. Я задаю margin-top для внутреннего, предполагая что внутренний контейнер "оттолкнется" от внешнего и сместится за заданное количество px. Но вместо этого
внешний сдвигается на заданное количество px, а внутренний стоит на месте (относительно внешнего. При этом я задаю margin-left и тут срабатывает как и предполагается: внутренний контейнер "отталкивается" от левой стороны внешнего (но при этом ширина контейнера 50px, я задаю margin-left:50px и внутренний контейнер становится посередине внешнего, почему так - тоже не понятно).
Объясните, пожалуйста, почему так и как это работает? Я хочу что бы внутренний отталкивался от левой и верхней стороны внешнего на заданное количество px.
Вот ссылка на codepan:
https://codepen.io/stpnki/pen/ZEZOVPY
Пробовал с position: absolute. Но это не совсем то.
(делаю первые шаги во frontend, заранее прошу прощения, если вопрос сильно тривиальный).