Placera en div

Tjenare alla,

Har klurat lite på hur man placerar en div på ett fast ställe men inte lyckats få till det riktigt. Jag ska försöka förklara så gott jag kan...

Har en sida med ett antal talesätt där man kan söka efter specifika talesätt. När man skriver i sökrutan listas max tio sökresultat i en ruta under sökrutan med hjälp av AJAX, precis som Google Suggest.
Jag har lyckats plasera denna rutan rätt snyggt under sökrutan som denna bilden visar, men det skiter sig rejält om man har annan upplösning än vad jag har... CSS-koden är följande:

#result{
  position: absolute;
  top: 88px;
  left: 339px;
  background: #FFF;
  border: 1px solid #000000;
  border-top: 1px dotted #999999;
  padding-left: 5px;
  padding-top: 5px;
  padding-bottom: 5px;
  width: 205px;
  display: none;
}

Kan någon vänlig själ hjälpa mig att få till så att denna resultatruta alltid ligger direkt under inmatningsfältet?

Jahopp, nu fick jag nästan till det. Nu lyckades jag få så att diven hamnar där den ska, oavsett upplösning. Men... Det finns ju alltid ett men... Diven flyttar på allt som ligger under. Se denna bilden. Denna gången testade jag med relative istället för absolute, och tänkte köra en z-index på den, men det ville den inte vara med på... Någon som har ett bra tips?

#result{
  position: relative;
  top: -1px;
  left: -195px;
  background: #FFF;
  border: 1px solid #000000;
  border-top: 1px dotted #999999;
  padding-left: 5px;
  padding-top: 5px;
  padding-bottom: 5px;
  width: 205px;
  display: none;
}

Du kan göra typ såhär:

<div id="foo">
 <div><input></div>
 <div id="result"></div>
</div>

#foo { position:relative; }
#result { position:aboslute; }

Grymt. En får tacka! (y)