I don't know that I fully understand the difference between these two.
Can someone explain why I would use one over the other and how they differ?
Bonus points for examples...=D
A:
from bytes:
"Margin is that space between the edge of an element's box and the edge of the complete box, such as the margin of a letter. 'top' displaces the element's margin edge from the containing blocks box, such as that same piece of paper inside a cardboard box, but it is not up against the edge of the container."
My understanding is that margin-top creates a margin on the element, and top sets the top edge of the element below the top edge of the containing element at the offset.
you can try it here:
http://w3schools.com/css/tryit.asp?filename=trycss_position_top
just replace top with margin-top to see the difference.
Orbit
2010-10-27 18:00:39
+4
A:
"top" is for tweak an element with use of "position" property. margin-top is for measuring the external distance to the element, in relation to the previous one.
Also, top behavior can differ depending on the type of position, absolute, relative or fixed.
Dave
2010-10-27 18:01:20
+1
A:
You'd use margin, if you wanted to move a (block) element away from other elements in the document flow. That means it'd push the following elements away / further down.
If you want the element to have no effect on the surrounding elements you'd use positioning (abs., rel.) and the top, bottom, left, right settings.
DanMan
2010-10-27 22:51:17