Float image over image on Gmail using HTML

have the following snippet of code that goes through email into GMAIL:

<table width="800" align="center" cellspacing="0" cellpadding="0" border="0" bgcolor="" class="100p">

<div style="position: relative; left: 0; top: 0;">

<img src="background.jpg" style="position: relative; top: 0; left: 0; display:block;"/>

<a href="link.com">
<img src="mainimage.jpg" style="position: absolute; margin-left: auto; margin-right: auto; left: 0; right: 0; top: 0; bottom: 0; top: 0; bottom: 0; display:block;" />
</a>

</div>

But when shown through gmail, it simply stacks the two.