CSS:如何使自动建议结果与输入字段对齐

Question

如果我将输入字段移动到页面上的其他位置，我似乎无法使自动建议字段的结果与输入字段对齐。我想知道我是否会使用这个位置：绝对还是什么？这是我的索引页的代码：

<input type="text" class="autosuggest"> <input type="submit" value="Search">
<div class="dropdown">
   <ul class="result"></ul>
</div>

下面是我的CSS代码：

body{
 font:0.8em Verdana;
   }
.autosuggest, .dropdown, .result {
  margin:0;
  padding:0;
  border:0;
  width:250px;
}
.autosuggest {
  padding:4px;
  border:1px solid #000;
}
.result {
  width:260px;
  list-style:none;
}
.result li {
  padding:5px;
  border:1px solid #000;
  border-top:0;
  cursor: pointer;
}
.result li:hover {
  background:#333;
  color:#fff;
}

Answer 1

尝试用相对定位的包装器包装input和.dropdown，并为.dropdwon添加position:absolute。然后尝试通过改变顶部和左侧来定位.dropdown。

诸如此类的事情http://jsfiddle.net/zsUuK/6/