This is an interactive example

Resize the height of your browser until only the top
half of this web page is in view, then scroll the page.

Absolute Positioning
Relative Positioning
Fixed Positioning

Here is the CSS used for this example:

      #object1 { position:absolute; top:115px; left:  0px; width:100px; height:100px; background:#88a; }
      #object2 { position:relative; top: -8px; left:110px; width:100px; height:100px; background:#a88; }
      #object3 { position:fixed;    top:115px; left:236px; width:100px; height:100px; background:#8a8; }

And here is the HTML: