3 ms·
nicely explained. one key trick they're missing: position:relative + position:absolute, which I find myself using more than position:absolute alone. With a par
by krosaen 16y ago
nicely explained. one key trick they're missing: position:relative + position:absolute, which I find myself using more than position:absolute alone. With a parent of position:relative, child position:absolute elements are position absolutely within the parent. Nice for centering overlays and things like that.
- stanleydrew 16y agoIn the full example at the end this is used twice actually.
- krosaen 16y agoah, good point, "Our #callout element is set to position: absolute, and since its parent element, #content is set to relative, the offset properties we’re using on #callout are based off the coordinates created by #content." would be nice to see it called out as one of the core techniques above though. or I guess I could have just read the whole article before commenting :)
- jjcm 16y agoStill though, when they're explaining absolute positioning they make this statement: "You can set an element to top: 100px and left: 200px; and that element will sit exactly 100px from the top and 200px from the left of the document." Which seems misleading, despite the example they show later.
- flyosity 16y agoOne of the defining articles on this exact topic was written by Doug Bowman back in 2003: http://stopdesign.com/archive/2003/09/03/absolute.html http://stopdesign.com/archive/2003/09/03/absolute.html