Welcome to ShenZhenJia Knowledge Sharing Community for programmer and developer-Open, Learning and Share
menu search
person
Welcome To Ask or Share your Answers For Others

Categories

What is the difference between using top and left properties and top and left margins?

I know top and left are usually used in position:absolute situation but I'm still wondering if there is any major difference.

ex:

position:absolute;
top:5px;
left:5px;

-vs-

margin-top:5px;
margin-left:5px;
See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
thumb_up_alt 0 like thumb_down_alt 0 dislike
262 views
Welcome To Ask or Share your Answers For Others

1 Answer

Well, the main difference is that absolutely positioned elements are pulled out of the content flow.

But also with relatively positioned elements, the surrounding content may become obfuscated.

Margins on the other hand are added to the element's size while the surrounding content flows accordingly.

See this sample fiddle with some differences.

Surely there are situations where both deliver the same results, but under normal conditions, these two aproaches aren't simply exchangeable nor comparable.


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
thumb_up_alt 0 like thumb_down_alt 0 dislike
Welcome to ShenZhenJia Knowledge Sharing Community for programmer and developer-Open, Learning and Share
...