旋轉木馬/幻燈片左右控制

Question

我有我的Django幻燈片放映。我試圖在中間垂直放置「.prev-btn」，在右邊垂直放置「.next-btn」。我試過position:absolute, right: 10px;但這不會對按鈕有任何影響。所以我在想，如果也許你能幫助我。這裏是工作圖像顯示.prev-btn和.next-btn不在正確的位置： https://jsfiddle.net/jozv4o29/3/ 幫助表示讚賞！

Answer 1

我剛剛添加了下面的代碼，它工作正常。你可以絕對定位你的按鈕，以便進行上一個和下一個導航。然後將其轉化爲50％。只是爲了確保它正好在中心。

JSFIDDLE

.prev-btn, .next-btn { 
    font-size: 40px; 
    color: white; 
    position: absolute; 
    top: 50%; 
    translate: transformY(-50%) 
} 
.prev-btn { 
    left: 0; 
} 
.next-btn { 
    right: 0; 
} 

Answer 2

你只需要定位箭頭相應看到下面的代碼

.prev-btn, .next-btn { 
    font-size: 40px; 
    color: white; 
    position: absolute; 
    top: 45%; 
} 
.prev-btn { 
    left: 0; 
} 

.next-btn { 
    right: 0; 
} 

https://jsfiddle.net/jozv4o29/4/