[Duda] Propiedades display, position, padding y margin

Hola compañero, una forma mas rápida de comprender, asimila cada etiqueta, clase o id como un cuadro, el "margin" es el espaciado fuera del cuadro, si quieres que tu cuadro se aleje de otro objeto (arriba, abajo, izquierda o derecha) le aplicas "margin", un ejemplo: margin: 10px; -> el cuadro se alejara o hara un espacio de 10px entre el y el otro objeto.

Al igual con el "padding" es lo mismo, pero aquí se hará un espacio interno, un ejemplo, tu cuadro tiene una imagen dentro, pero quieres que esa imagen se aleje del borde del cuadro, entonces le aplicas "padding", de esta manera: padding: 5px; -> la imagen hara un espacio o se alejara 5px del borde del cuadro, o de las paredes del cuadro.

Con display: inline, lo que hace es que cada elemento lo pone uno detrás del otro, ejemplo: [elemento 1][elemento 2][elemento 3], mientras que display: block; cada elemento lo agrega o ubica uno dejaba del otro.

ejemplo:

• [elemento 1]
• [elemento 2]
• [elemento 3]

Espero haberte ayudado, suerte en los siguientes temas!!