Javascript 根据输入元素定位DIV

我希望当用户在输入元素中输入文本时，DIV是可见的。我可以用AJAX实现这一点。但是我不能将DIV完全放在INPUT元素下面。我希望它像下拉列表一样显示。DIV的内容由用户输入更改。我到处找了，但什么也没找到。 CSS或JS将非常有用。 这是我的密码：

<tr>
    <th align="left">Görevli Olduğu Kurum Kodu (Farklı bir kurumda görevli ise)</th>
    <td>
        <input type="text" id="gkrm" name="gkrm" value="" onkeyup="AJAXCODE_TO_LOAD_DIV_CONTENT">
        <div id="gkrmlist">
        </div>
    </td>
</tr>

戈雷夫利·奥尔杜奥·库鲁姆·科杜（Farklıbir kurumda Görevli ise）

在该代码中，我希望gkrmlist DIV显示在gkrm输入下。但它出现在输入元素的右侧

---

我想将红色圆圈中的DIV放置到绿色箭头所示的位置

要将input下的div设置为绝对值，必须将

位置：relative

添加到其父项。然后将

absolute

设置为div，将

设置为left

，

设置为right

，

设置为top

。输入容器{
位置：相对位置；
}
.input container.input下拉列表{
位置：绝对位置；
左：0；
右：0；
顶部：计算值（100%-1px）；
背景颜色：蓝色；
颜色：#fff；
}

戈雷夫利·奥尔杜奥·库鲁姆·科杜（Farklıbir kurumda Görevli ise）
我是迪夫

位置为“绝对”的元素根据其第一个位置为“相对”的父元素定位自身

因此，非常有必要将其父元素的位置设置为

“relative”

下面是HTML和CSS代码

HTML:

---

享受吧

我投票将这个问题作为离题题来结束，因为在这一点上，您应该尝试自己编写代码。如果你有问题，你可以发布你尝试过的东西，清楚地解释什么不起作用，并在问题本身中提供一个答案。这就是做它想做的事情。它将div置于其父元素的中心，因此，我接受了这个解决方案。但我需要将div置于输入元素的中心，而不是TD。我的一些TD元素比TD大，我用它来显示DIV。我想要的是对第二条评论感到抱歉。新手：）

<tr>
    <th align="left">Görevli Olduğu Kurum Kodu (Farklı bir kurumda görevli ise)</th>
    <td class="rel">
        <input type="text" id="gkrm" name="gkrm" value="" onkeyup="AJAXCODE_TO_LOAD_DIV_CONTENT">
        <div id="gkrmlist">
        </div>
    </td>
</tr>

.rel {
    position: relative;
    width: 200px;
}
#gkrmlist {
    position: absolute;
    top: 100%;
    width: 200px;
    left: 0px;
}