Her zaman ekranın üst için, kullanmayı bil div: bir düzeltmeye çalışıyorum

position: fixed;
top: 0px;
right: 0px;

Ancak, div merkezli bir kabın içinde. position:fixed kullandığımda böyle tarayıcının sağ tarafına bağlı olarak div tarayıcı penceresine göre düzeltir. Bunun yerine, kabına göre monte edilmelidir.

Biliyorum o position:absolute kullanılabilir düzeltmek için bir öğeyi göreli için div ama ne zaman sayfayı aşağı kaydırın unsuru kaybolur ve yok sopa üst olarak position:fixed.

Bir ya da bunu başarmak için hack çözüm var mı?

Kısa cevap:hayır.(Şimdi CSS dönüşümü ile mümkündür. Aşağıda edit)

Uzun cevap: kullanarak sorunu "sabit" konumlandırma eleman alirçok akışkan. böylece eğer bir şey yapmasaydın. çünkü yeniden konumlandırılmış üst göreli olamaz. Ancak konteynır sabit, bilinen bir genişlik ise, gibi bir şey kullanabilirsiniz:

#fixedContainer
{
  position: fixed;
  width: 600px;
  height: 200px;
  left: 50%;
  top: 0%;
  margin-left: -300px; /*half the width*/
}

http://jsfiddle.net/HFjU6/1/

Düzenle (03/2015):

Bu eski bir bilgi. CSS3 büyüsü yardımı ile dinamik bir boyut (yatay ve dikey) merkezi içeriği dönüştürmek artık mümkün. Aynı ilke geçerlidir, ama marj konteyner dengelemek için kullanmak yerine, translateX(-50%) kullanabilirsiniz. Bu işe yaramazsa ile yukarıda marjı hile, çünkü bilmiyorsun ne kadar uzaklık bu sürece genişliği sabit ve sen bir insan değilsin göreli değerler (50%) çünkü olacak göreli veli ve eleman uygulamalı. transform farklı davranır. Değerlerine uygulanır eleman göredir. Marjı 50% üst genişliğinin yarısı ise, 50% transform böylece anlamına gelir unsuru yarısı genişliği. Bu IE9 solution

Yukarıdaki örneğe benzer bir kod kullanarak, aynı senaryo tamamen dinamik genişlik ve yükseklik kullanarak yeniden:

.fixedContainer {
    background-color:#ddd;
    position: fixed;
    padding: 2em;
    left: 50%;
    top: 0%;
    transform: translateX(-50%);
}

Eğer bencil olmak istiyorsanız, bunu da yapabilirsiniz:

.fixedContainer {
    background-color:#ddd;
    position: fixed;
    padding: 2em;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

Demolar:

Yalnızca yatay olarak ortalanmış: http://jsfiddle.net/b2jz1yvr/
Hem yatay eksende ve dikey olarak ortalanmış: http://jsfiddle.net/b2jz1yvr/1/

Bu cevap beni işaret için Kullanıcı aaronk6 gider orijinal kredi: http://stackoverflow.com/a/28773941/854246