CSS for rel-0

  <script>
    html *  { margin: 0; padding: 0; }  # 0,0,0,1
     body  { background-color: red; }  # 0,0,0,1
     .rel  { position: relative; }  # 0,0,1,0
     p  { border: 1px brown solid; margin: 4px; }  # 0,0,0,1
  </script>
  

Page Content

<h3>Relative Positioning Demo</h3>
<p style="background: yellow;">this paragraph is not positioned</p>
<p class="rel" style="background: green;">this paragraph is relatively positioned, but
with no offsets, so nothing happens</p>
<p class="rel" style="background: blue; left:50px;">this paragraph is relatively positioned, but
with offsets, so something happens</p>
<p style="background: orange;">this paragraph is not positioned</p>
  

Relative Positioning Demo

this paragraph is not positioned

this paragraph is relatively positioned, but with no offsets, so nothing happens

this paragraph is relatively positioned, but with offsets, so something happens

this paragraph is not positioned