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

Question

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

<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

尝试用相对定位的包装器包装你的inputand ，并添加for 。比尝试通过改变顶部和左侧来定位。.dropdownposition:absolute.dropdwon.dropdown

类似的东西http://jsfiddle.net/zsUuK/6/