p { background:#069; color:#fff }
O div pos tem posicionamento relativo. Nesse caso, sua posição é computada com relação à posição que ele deveria ocupar caso seu posicionamento fosse estático. A diferença em relação a um elemento posicionado estaticamente é que as propriedades top e left, bem como suas complementares bottom e right, têm efeito sobre ele.
Diferentemente de margin, as propriedades top e left (você sabe, suas complementares também) não acrescentam seus valores ao tamanho do elemento. Você pode perceber isso usando o DOM Inspector do Firefox. Procure pelo div com id pos e clique sobre ele. Faça o mesmo com o div test (que tem margin-top:50px) e veja a diferença. Além disso, um elemento posicionado relativamente (ou seja, "posicionado") se sobrepõe a qualquer elemento não "posicionado", porém ele não é removido do fluxo normal da página (perceba o espaço entre o texto de test e p)
Esse exemplo se refere ao post Posicionamento com CSS: estático, absoluto, relativo e fixo