[CSS] Diferencias entre margin-top y top

[EladioJr99]

Estoy aprendiendo CSS y me surgió la duda de las diferencias, bueno es que estoy maquetando una página con css pero use margin-top y luego lo cambie por top y no hubo ningun cambio, entonces no se cuando usar una u cuando usar la otra

[engel lex]

margin top es absolutamente sobre el margen contra el elemento de arriba. es decir, es como si crearas un div alli para rellenar

top es un posicionador, es decir, ubica al elemento en una posición, esto no es parte del elemento (como las propiedades que afectan a margin)

usualmente se comportan muy similar, pero en presencia de el atributo position, top tendrá comportamientos diferentes que margin

[EladioJr99]

margin top es absolutamente sobre el margen contra el elemento de arriba. es decir, es como si crearas un div alli para rellenar

top es un posicionador, es decir, ubica al elemento en una posición, esto no es parte del elemento (como las propiedades que afectan a margin)

usualmente se comportan muy similar, pero en presencia de el atributo position, top tendrá comportamientos diferentes que margin

Entonces por ejemplo estaba maquetando una página para practicar y use puro margin-left y margin-top, hubiera sido mejor utilizar el top y el left, para posicionar los cuadros, quedo así

Perdon si es una pregunta muy básica pero estoy muy verde

[engel lex]

no, usualmente es mejor mantener margen que posicionamiento, el posicionamiento te puede descuadrar en responsive, el margen es más solido en ese aspecto, usualmente top y left se usa con position cuando es absolute o fixed

[eLank0]

La teoría está muy bien, pero.. a no ser que modifiques los elementos padre:

Con position absolute, los margins no funcionan y tienes que usar top.

Con position relative justo al revés.

Saludos.