Not CSS3 specific, but here’s an example of how EM and REM size differently according to their containers.
EM
This is 1em
This is 2em
This is 3em
This is 4em
This is 5em
REM (when base is 16px)
This is 1rem
This is 2rem
This is 3rem
This is 4rem
This is 5rem
PX
This is 8px
This is 10px
This is 12px
This is 14px
This is 16px
This is 18px
This is 20px
This is 24px
EM in an EM
This text is 2EM
and this is 0.5em
and this is 3em
But wait, that 0.5em is the same as 1em up top, and the 3em is bigger than 5em up top!
YES IT IS, because EM sizes relative to it’s PARENT!
REM in an EM
This text is 2EM
and this is 0.5rem
and this is 3rem
Hey look, now it’s the size that I expect it to be!
YES IT IS, because REM sizes relative to the ROOT element (which is set to 16px for this example)