fixed positioning
Fixed positioning is a subcategory of absolute positioning. The only difference is that for a fixed positioned box, the containing block is established by the viewport. For continuous media, fixed boxes do not move when the document is scrolled. In this respect, they are similar to fixed background images. For paged media (where the content of the document is split into one or more discrete pages), boxes with fixed positions are repeated on every page. This is useful for placing, for instance, a signature at the bottom of each page. Boxes with fixed position that are larger than the page area are clipped. Parts of the fixed position box that are not visible in the initial containing block will not print.
margin and left values add up, they push the pink box away from the left edge of the viewport. The width (100%) is the width of the viewport, not the width of the parent container as the wrapper is not the positioning block.
Half of the box is clipped. There is no horizontal scrollbar and resizing the browser window does not reveal the other halh of the box.
