使用css位置定位动态加载的搜索结果框

Question

以下是我机器中的样子：

如果您visit the site并搜索某些内容，我确定您会看到此框未对齐，因为您的显示器/分辨率可能与我的不同。

我的问题是，无论显示器的宽度如何，我如何定位，以便始终位于搜索框下方？

Answer 1

将position: relative添加到#mini-search-wrapper。然后，您可以根据#mini-search-wrapper - 元素的位置对齐搜索结果。

position: absolute绑定到定义了position: relative的下一个父元素。在这种情况下，您没有在元素上定义相对位置，因此它绑定到document-root，即html元素。

position: fixed始终绑定到document-root。

浏览器中的默认position为static。

我希望这可以帮助您了解position - 属性在CSS中的工作原理。