初めに、、

日本語に翻訳すると

position ＝　場所
absolute　＝　絶対
relative = 相対的

です

使い方

今回は、白い箱を基準に動かしていきます
デフォルトでは、top:0px;・left:0px;のところに配置されている

指定なしの場合

position:relative;

赤いprodactをrightに200px動かすと、、

position:relative;
right:0px;

赤いprodactをtopに0px動かすと、、

position:relative;
top:0px;

赤いprodactをbottomに0px動かすと、、

position:relative;
bootm:0px;

赤いprodactをleftに200px動かすと、、

position:relative;
left:0px;

最後に

ポジションの指定は、複数合わせる事ができて、例えば、、、

top 200px
left 200px
指定すると、、、

position:relative;
top:200px;
left:200px;

上記のように配置されます