固定股利與填充和文本對齊交互不同

Question

我有一個父div有一個孩子。父是粘，孩子是mainPicWrapper

CSS：

.mainPicWrapper { 
    border:1px solid black; 
    padding-left:25px; 
} 

#sticky-div.sticky { 
    position: fixed; 
    top: 0; 
    border:0px; 
} 

我有jQuery的網頁加載中刪除.sticky class。

然後，當向下滾動過去div頂部，它增加了.sticky類回去，所以div停留在頁面的頂部，而它向下滾動，工作正常。

但是，如果我刪除padding-left:25px;與text-align:center;取代它，然後它不工作。用text-align:center;，當我滾動時，div突然跳到左邊歸零。

爲什麼padding-left留適用於粘div，但text-align:center;不？

這裏是一個JSFiddle演示。

與padding的問題，實際上是img在那div。圖像經常變化大小。如果你滾動時有padding，那很好，圖像滾動到正確的位置。但使用padding會導致多個大小的圖像永不加載在div的中心，這正是我所需要的。

Answer 1

你試過這個嗎？

.mainPicWrapper { 
border:1px solid black; 
text-align:center; 
} 

#sticky-div.sticky { 
position: fixed; 
top: 0; 
border:0px; 
right:7px; 
width:70%; 
} 
.topRightMainContainer { 
border:1px; 
width:70%; 
position:absolute; 
right:7px; 
} 

DEMO