Two elements getting on top of each other on zoom in

As the title says: I have two elements (images) that get on top of each other when I zoom in.the img on the left is the logo and the one on the right is a leaderboard size image.

<div style="max-height:90px;margin-bottom:20px;display:block;">

  <p style="max-height:90px;width:330px;float:left;">
    <a href="#">
      <img src="#" />
    </a>
  </p>

  <p style="float:right;">
    <a href="#" target="_top">
      <img src="#" width="728" max-height="90" alt="Image" border="0" />
    </a>
  </p>
</div>