如何垂直對齊Twitter Bootstrap旋轉木馬的箭頭？

Question

正如你在旋轉木馬上看到的那樣，有一個箭頭可以向右或向左滑動。

http://twitter.github.com/bootstrap/javascript.html#carousel

我不使用字幕。因此，我希望它是垂直居中。 現在是這樣

我怎麼能垂直居中那箭？

Answer 1

哪裏的元素最終在您的佈局着陸可以通過令人難以置信的數量的因素操縱。沒有看到你的標記，你的問題的具體解決方案是不可能的。但是，如果您知道旋轉木馬的高度將保持不變，那麼您可以很容易地調整這些元素的位置，但無論它適合多少像素。

使用jQuery，你可以找到元素的位置，然後只需要添加20個像素。

使用jQuery通過offset documentation。

// on carousel load or document load 
$(".arrows").each(function() { 
    // Scoot the icons down from where they are 
    var newTop = $(this).offset.top + 30; 
    var sameLeft = $(this).offset.left; 
    $(this).offset({top:newTop, left:sameLeft }); 
}); 

但是，您也可以在箭頭的CSS中指定所需的位置。儘管沒有看到這些圖標的css，但我不確定css會幫助你安排它們，因爲無論可能建議什麼可能與你已經鋪設它們的方式相沖突。

編輯：

經由twitter.github.com網站，我看了一下CSS對於那些轉盤控制和調整下面的CSS這似乎達到影響你正在尋找：

.carousel-control { 
    position: absolute; /* already here */ 
    top: 50%; /* Was top: 40% */ 
    ... 
} 

你應該在你自己的CSS文件中重寫該CSS。添加你自己的班級，並將其添加到箭頭上，或者只使用已有的班級，並根據需要使用!important。