CSS HTML - How to make the anchor pictures go to a specific spot
<p>How do I make all my anchor links / images go to specific sides I want the teams one on top left I want store top right sponsors bottom left and about us bottom right I thought I did all the right code but they don't how up in those specific spots</p>

<p>If anyone can help it will be greatly appreciates </p>

<p><strong>CSS</strong></p>

<p><div class="snippet" data-lang="js" data-hide="false">
<div class="snippet-code">
<pre class="snippet-code-css lang-css prettyprint-override"><code>.icon1.jpg {
      position: absolute;
      top: 0px;
      left: 0px;
      height: auto;
      width: 50%;
    }
    .icon2.jpg {
      position: relative;
      top: 0px;
      right: 0px;
      height: auto;
      width: 50%;
    }
    .icon4.jpg {
      position: relative;
      left: 0px;
      height: auto;
      width: 50%;
    }
    .icon3.jpg {
      position: relative;
      right: 0px;
      height: auto;
      width: 50%;
    }
    .DelUZens {
      display: block;
      margin-left: auto;
      margin-right: auto;
    }
    body {
      background: url("icon6.jpg") repeat;
    }
    #banner {
      position: absolute;
      top: 0px;
      left: 0px;
      right: 0px;
      width: 100%;
      height: 175px;
      z-index: -1;
    }</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code> &lt;html&gt;
    &lt;head&gt;
      &lt;title&gt;DelUZens&lt;/title&gt;
      &lt;link href="main.css" rel="stlesheet" type="text/css"&gt;
    &lt;/head&gt;
    &lt;body bgcolor="#000"&gt;
        &lt;div z-index:1;&gt;
          &lt;p&gt;
            &lt;a href="teams.html" target="_blank"&gt;
              &lt;img src="icon1.jpg" style='width:50%;' border="0" alt="Null" class="top" z-index:2&gt;
            &lt;/a&gt;
          &lt;/p&gt;
          &lt;p&gt;
            &lt;a href="store.html" target="_blank"&gt;
              &lt;img src="icon2.jpg" style='width:50%;' border="0" alt="Null" class="right" z-index:3&gt;

            &lt;/a&gt;
          &lt;/p&gt;
          &lt;p&gt;
            &lt;a href="sponsors.html" target="_blank"&gt;
              &lt;img src="icon4.jpg" style='width:50%;' border="0" alt="Null" class="left" z-index:4&gt;
            &lt;/a&gt;
          &lt;/p&gt;
          &lt;p&gt;
            &lt;a href="aboutus.html" target="_blank"&gt;
              &lt;img src="icon3.jpg" style='width:50%;' border="0" alt="Null" class="bottom" z-index:5&gt;
            &lt;/a&gt;
          &lt;/p&gt;
        &lt;/div&gt;
        &lt;div id="myDiv" style="position:absolute; top:230px; left:591px; right: 591px; bottom: 230px;  width:0px; height:0px; z-index:8;"&gt;
          &lt;img src="icon5.png" class="DelUZens"&gt;
        &lt;/div&gt;
      &lt;/body&gt;
    &lt;/html&gt;</code></pre>
</div>
</div>
</p>

<p>Thank you in advance.</p>