javascript position tooltip

Hej eksperter står og kunne godt bruge noget hjælp.

Jeg er ved at lave et tootip som kommer frem når jeg trykker på forskellige links og dette virker som også.

Problemet er så at "tooltipen"  kommer frem forskellige steder på siden det er så her jeg godt kan bruge noget hjælp til noget kode jeg gør at det springer frem samme sted??

Håber dette giver mening.

Her har lige koden som den ser nu:

<style type="text/css">
.tooltip {
    display: none;
    width: 500px;
    height:auto;
    padding:10px;
 
    border: 1px solid black;
    font-family: Verdana, Geneva, sans-serif;
    font-size:11px;
    background-color:#FFF;
    font-weight:normal; line-height:16px;
    float:left;
    position: absolute;   

    }
   

   
#kort{ position: relative; text-align:center; float:left; width: 600px; height: 791px; background-image:url(kort.png);  background-repeat:no-repeat;  }



img { border: none; }


</style>

<script type="text/javascript">
function showTip(id) {
    var e = document.getElementById(id);
    if (e.style.display == '' || e.style.display == 'none') {
        e.style.display = 'block';
    }
}
function hideTip(id) {
    var e = document.getElementById(id);
    e.style.display = 'none';
}
</script>



<div id="kort">


<!-- Brande HK start -->

<!-- Street Håndbold -->


<a href="#" onclick="showTip('tip1');"><img src="box1.png" alt="Kom og være med til Street Håndbold - et nyt type spil" style="position:relative; float:left; width: 310px; height: 36px; margin-top:633px; margin-left:145px;" />
</a>

<div class="tooltip" id="tip1">
    <a href="#" onclick="hideTip('tip1');"><img src="close-button-lightbox.png" alt="Luk" title="Luk" style="float:left;" /></a>
    <br /><br />
    <p style="font-weight:bold;" align="left">Kom og være med til Street Håndbold - et nyt type spil.  <br /> <br />
    Sted: Brandehallerne &nbsp;  Dato:  2. september    &nbsp;      Tid: 17:30-19:00 </p>
   
    <img src="bkhaanball_LOGO.png" style="margin-top:-105px; margin-left:420px; position:relative; padding-top:5px; float:left;"/>
 
    <p align="left">
    I Brande HK's ungdomsafdeling vil vi sammen med de unge U12-U14 drenge                          <br />
    og pige spiller, arrangere Street Håndbold som er ny type spil,                                  <br />
    der skal genskabe håndboldspillets popularitet især blandt børn                                  <br />
    og unge i skolealderen. Street Håndbold er anderledes end alm. håndbold i den forstand, at der spilles til ét mål i hvert spil.
    <br />  <br />
    Hjemmeside: &nbsp; &nbsp; <a href="http://www.ndehk.dk/default.php" target="_blank" title="Brande HK">Brande HK </a>
  </p>
       
</div>

<!-- Street Håndbold slut -->
<!-- Brande HK slut -->

<!-- Ikast Brande ski  -->


<a href="#" onclick="showTip('tip2');"><img src="box2.png" alt="Rul på Hagelskærvej!" style="position:relative; float:left;  width: 310px; height: 36px; margin-top:-425px;  margin-left:190px; padding-top:5px; " /></a></div>

<div class="tooltip" id="tip2">
  <a href="#" onclick="hideTip('tip2');"><img src="close-button-lightbox.png" alt="Luk" title="Luk" style="float:left;" /></a>
    <br /> <br />
    <p style="font-weight:bold" align="left">Rul på Hagelskærvej! <br /> <br />
    Sted: P-pladsen, øst, ved nordre Skole og Fritidshjemmet  <br />Dato:  1. september      &nbsp;    Tid: 17.45-20.00 </p>
   
    <img src="logo-webbillede.png" style="margin-top:-105px; margin-left:420px; float:left;"/>
    <p align="left">
    Åbent hus kl. 17.45.18.30, hvor rulleski prsenteres og kan afprøves af publikum. <br />
Demonstration af rulleski kl. 19-20: Fælles løb med rulleskøjter og rulleski. <br />
Der er ikke tidstagning. Medbring cykelhjelm og gerne knæbeskyttere til denne event.
    <br />  <br />
    Hjemmeside: &nbsp; &nbsp;
   
<a href="http://www.brandeskiklub.dk" target="_blank" title="www.brandeskiklub.dk">Ikast brande skiklub </a>
   
</p>
 
       
</div>

<!-- Ikast Brande ski slut -->


<!-- Zumba - dansefitness - og MBL.  -->


<a href="#" onclick="showTip('tip3');"><img src="box3.png" alt="Zumba - dansefitness - og MBL." style="position:relative; float:left;  width: 310px; height: 36px; margin-top:-300px; margin-left:370px;  padding-top:5px; " /></a></div>

<div class="tooltip" id="tip3">
  <a href="#" onclick="hideTip('tip3');"><img src="close-button-lightbox.png" alt="Luk" title="Luk" style="float:left;" /></a>
    <br /> <br />
    <p style="font-weight:bold" align="left">Zumba - dansefitness - og MBL. <br /> <br />
    Sted: Ejstrupholm Skole <br />Dato:  4. september    &nbsp;    Tid: 10-10:45 og 11-11:45 </p>
   
    <img src="dof.png"  style="margin-top:-105px; margin-left:420px; float:left;"/>
    <p align="left">
    Kom og prøv Zumba, som er den nyeste form for dansefitness.<br />
    MBL betyder mave-balle-lår og er en mere traditionel form for fitness-træning.<br /> 
Demonstration af rulleski kl. 19-20: Fælles løb med rulleskøjter og rulleski. <br />
Der er ikke tidstagning. Medbring cykelhjelm og gerne knæbeskyttere til denne event.
    <br />  <br />
    Hjemmeside: &nbsp; &nbsp; <a href="http://www.dof-brande.dk/" target="_blank" title="http://www.dof-brande.dk/">Dof-brande </a>
  </p>
       
</div>

<!-- Zumba - dansefitness - og MBL. -->




</div>