To restore normality, the rest of this page is inside a DIV element that has been given '20px' margins on all four sides. It should therefore be a gap above this emphasized paragraph as well as on the sides.
Stretching out
The initial value of 'margin' is '0' while the initial value of 'width' is 'auto'. For block-level elements, the auto value means that the element should stretch out to the inner edges of the parent element. The red background of the H3 element below should therefore be as wide as the canvas minus the '10px' margin of the DIV element. In other words, it should be as wide as this paragraph.
headline
The text inside the H3 element above ("headline") should be centered.
Intrinsic dimension
Replaced elements (e.g. images) come with an intrinsic dimension and the width of the element is therefore given. For the IMG element below, the margin, border and padding properties are all set to '0', and it's horizontal formatting is therefore overconstrained and 'margin-right' will be assiged 'auto' as described in section 4.1.2. So, the image below this paragraph will be positioned on the left side.
The image below this paragraph is identical to the image above, except that the 'margin-left' property has been set to 'auto'. The horizontal positioning is therefore not overconstrained and the zero width right margin will be honored. So, the image will end up on the right side.
The image below has both 'margin-left' and 'margin-right' set to auto. These will therefore be set to equal values and the image should be centered:
howcome 970613, 970814