內我有一個定位的div其內容可能太長，以便出現滾動條（overflow:auto集）。它在ajax應用程序中用作對話框。我想修復右上角的關閉按鈕，所以當用戶滾動div時不會滾動。CSS位置是：固定一個定位元件
我position:fixed; right:0; top:0 tryed它，但它不是放置在div（在Firefox）在頁面的右上角的按鈕。
是否有可能使用CSS來做到這一點按鈕位置不只是在每次滾動事件在JS與offsetWidth /身高黑客攻擊？
ps：div的高度和寬度不是固定值，它取決於內容的大小和瀏覽器窗口的大小。用戶還可以調整它的大小，如果他想。
您可以使用position:fixed;，但不設置left和top。然後，您將使用margin-left將它向右推，以將其定位在您希望的正確位置。
檢查演示在這裏：http://jsbin.com/icili5
Position:fixed給出關於瀏覽器窗口中的絕對位置。所以它當然會去那裏。
雖然position:absolute指父元素，因此，如果您將容器< div>裏面你<div>按鈕，它應該位置，你的意思是它是。 類似
編輯：感謝@Sotiris，誰有一個點，解決方案可以實現使用一個位置：固定和餘裕。像這樣：http://jsfiddle.net/NeK4k/
看來，CSS變換可以用來
「‘變換’屬性建立在元素的新局部座標系」，
但是......是不是跨瀏覽器，似乎只有歌劇作品正常
如果您的關閉按鈕將是文本，這對我來說很好：
#close {
position: fixed;
width: 70%; /* the width of the parent */
text-align: right;
}
#close span {
cursor: pointer;
}
那麼你HTML可以只是：
<div id="close"><span id="x">X</span></div>
，當前選中的解決方案似乎誤解了問題。
訣竅是既不使用絕對定位也不使用固定定位。相反，關閉按鈕之外的其他部分位置設置爲相對和一個左浮動，以便它立即正確的div。接下來，設置一個負左邊距和一個正Z指數，使其出現在div上方。
下面是一個例子：
#close
{
position: relative;
float: left;
margin-top: 50vh;
margin-left: -100px;
z-index: 2;
}
#dialog
{
height: 100vh;
width: 100vw;
position: relative;
overflow: scroll;
float: left;
}
<body>
<div id="dialog">
****
</div>
<div id="close"> </div>
</body>
我知道這是一個老的文章，但我有同樣的問題，但沒有找到該元素相對固定設置爲父母div答案。medium.com上的滾動條是一個很好的純CSS解決方案，用於設置position: fixed;相對於父元素而不是視口（kinda *）。它是由母體div設置爲position: relative;以及具有position: absolute;按鈕包裝，當然按鈕實現的是position: fixed;如下：
<div class="wrapper">
<div class="content">
Your long content here
</div>
<div class="button-wrapper">
<button class="button">This is your button</button>
</div>
</div>
<style>
.wrapper {
position: relative;
}
.button-wrapper {
position: absolute;
right: 0;
top: 0;
width: 50px;
}
.button {
position: fixed;
top: 0;
width: 50px;
}
</style>
*由於固定元件不與所述頁面滾動垂直位置仍將相對於視口，但水平位置相對於此解決方案的父項。
嘗試位置：粘貼對您要修復的元素的父div。
更多的信息在這裏：http://html5-demos.appspot.com/static/css/sticky.html。 注意：檢查瀏覽器版本兼容性。
這可能是值得考慮使用一個具有固定位置背景圖像的div的按鈕。 – cloudrave 2013-11-10 19:48:15
@NickM似乎是一個好主意，但是如何點擊按鈕呢？ – ithil 2014-11-07 08:51:08
@ithil只要div的高度和寬度設置爲與背景圖像的高度和寬度相匹配，就應該可點擊。至於*處理*點擊，這取決於你是否使用純HTML或JS。如果它只是HTML，你可以用`href`將標籤封裝在`a`標籤中（甚至可以用`a`標籤代替`div`並將其設置爲`display：inline-block`）。如果是JS，你可以聽點擊`div`。我正確理解你的問題嗎？ – cloudrave 2014-11-07 19:10:43