html - 调整大小时如何在屏幕上保持绝对定位元素

Question

我有一个类似于 http://jsfiddle.net/hsmishka/54t32vfc/2/ 的自定义下拉菜单.调整窗口大小时，如何在屏幕上保持绝对定位的下拉菜单？像 right: 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;
}

Answer 1

我认为外部标签也需要是绝对的，因为它包裹着下拉标签。试试看？