Reply To: Some issues about relation between width/height and margin/padding/border

[spz1st]

Here is a case of inconsistence of width/height definition and/or implementation. One of the arguments why width/height should not include margins is that an element does not include margins and width and height are set for the element, therefore they should not include margins. Now I have an element of 100px for width and height and with a blue background. According to this argument, if I position this element, say at left: 100px; top: 100px;, and I add a margin, say 10px in thickness, to the element, the upper-left corner of the blue square should still stay at 100,100, right? That is, the upper-left corner of the margin should be at 90,90. Yet the two browsers (chrome and safari) I use pushed the blue square to 110,110 and the upper-left margin is at 100,100. Clearly here the margin is considered as the part of the element.

Here is the demo page: http://www.arvha.com/position.html