I am trying to make a suggest research box like Google. I am not doing the server side with Ajax for the moment because I have a problem with my code. As you can see on the picture, the position of the suggestion box is not correct.

Positionement problem with JS

Here is the code :

  var values = ["Chatelet", "Gare de Lyon", "Orsay-Ville"];


function positionner() {
var suggest = document.getElementById("suggestion");
var champ = document.getElementById("fmsearch");
suggest.style.left = getLeft(champ) + "px";
suggest.style.top = (getTop(champ) + champ.offsetHeight) + "px";
}

function getLeft(element) {
var offsetLeft = 0;
while (element != null) {
offsetLeft += element.offsetLeft;
element = element.offsetParent;
}
return offsetLeft;
}
function getTop(element) {
var offsetTop = 0;
while (element != null) {
offsetTop += element.offsetTop;
element = element.offsetParent;
}
return offsetTop;
}
positionner();




function suggerer() 
{
  var suggest = document.getElementById("suggestion");
  suggest.innerHTML = "";
  var i, ele;
  for (i=0 ; i<values.length ; i++)
  {
    ele = document.createElement("div");
    ele.innerHTML = values[i];
    suggest.appendChild(ele);
  }
  suggest.style.display = "block";
}