Html 调整大小时如何保持屏幕上的绝对位置元素

我有一个类似的自定义下拉列表。 调整窗口大小时，如何保持绝对位置下拉列表在屏幕上？ 类似右的东西：0；但只有当它不适合窗户的时候

<div class="outer">
    <div class="dropdown">
        <ul>
            <li>item 1</li>
            <li>item 2</li>
        </ul>
    </div>
<div>
.outer {
    position: relative;
    margin: 100px;
    width: 400px;
    border: 1px solid green;
}

.dropdown {
    position: absolute;
    background: #EEE;
}

li {
    background: grey;
    height: 20px;
    width: 200px;
}

项目1
项目2

.外部{
位置：相对位置；
利润率：100像素；
宽度：400px；
边框：1px纯绿色；
}
.下拉列表{
位置：绝对位置；
背景：#EEE；
}
李{
背景：灰色；
高度：20px；
宽度：200px；
}

我认为外部标记也必须是绝对的，因为它正在包装下拉标记。试试看？

我不确定你的最终目标是什么。但你可能需要的是一些媒体查询。实际上，我会建议检查引导，因为它是为响应性设计而构建的

但要使您想要的工作正常，您需要确保下拉父项设置为：

position: relative;

然后下拉列表将被约束到父级。否则，它将与身体或任何最近的相对元素有关。

成功了

Position:fixed; right:0;