html - 如何在调整屏幕大小时将关闭按钮放置到弹出 div 的顶部而不让它四处移动

Question

我正在寻求一些帮助，将“关闭”按钮放置在弹出式 div 的顶部，而不会在调整屏幕大小时使它四处移动。我已经尝试设置绝对和相对位置，但它似乎不起作用 - 当我调整窗口大小时它会四处移动。

这是链接:http://jsfiddle.net/R2UHm .

我不确定为什么 jsfiddle 没有按照我想要的方式显示它，但我只是剪掉了那一小部分。

我附上了指向我正在寻找的内容的屏幕截图的链接。 http://i.imgur.com/Eh3Izmw.jpg

.

Answer 1

将关闭按钮包裹在另一个 div 中

<div class="overlay-bg">
    <div class="close-btn-wrapper">
       <button class="close-btn2">X</button>
    </div>
    <div class="overlay-content">
    // rest of the content

CSS

.close-btn-wrapper{
    position:relative;
    width:700px;
    left:30%;
}

.close-btn2{
    position:absolute;
    top:0;
    right:0;
}

根据需要更改 top 和 right 值。