Bootstrap列未在移動設備上居中

-1

我使用Bootstrap作爲我的個人站點的簡單登錄頁面。我沿着底部有一排接觸按鈕，我正在與列對齊。我在臺式機上的設置很好，但在移動設備上（我使用的是iPhone 5），按鈕向右移動一點。我已經嘗試了不同的斷點大小和列的偏移量，但似乎無法讓它們在桌面和移動設備上正確對齊。Bootstrap列未在移動設備上居中

Here's my site

來源

2015-04-06 Matt Cooper

問題是，你的圖像比列寬，你可以改變它爲'col-xs-3'沒有偏移量或使圖像寬度100％，這將限制圖像寬度的寬度列。 – APAD1

擴大對我的評論上面，如果你想保持相同的佈局在桌面上，你可以改變按鈕的結構跨越上高於任何移動3列和2列：

<div class="row" id="contact"> 
    <div class="col-xs-3 col-sm-2 col-sm-offset-2"> 
     <a href="mailto:[email protected]" target="_top"><img class="contactImg" alt="email" src="images/email.png"></a> 
    </div> 
    <div class="col-xs-3 col-sm-2"> 
     <a href="https://www.linkedin.com/profile/view?id=282192735"><img class="contactImg" alt="LinkedIn" src="images/linkedin.png"></a> 
    </div> 
    <div class="col-xs-3 col-sm-2"> 
     <a href="https://facebook.com/mattjcoop"><img class="contactImg" alt="Facebook" src="images/facebook.png"></a> 
    </div> 
    <div class="col-xs-3 col-sm-2"> 
     <a href="https://twitter.com/TheMattyCoops"><img class="contactImg" alt="Twitter" src="images/twitter.png"></a> 
    </div> 
</div>

來源

2015-04-06 17:35:56 APAD1

Bootstrap列未在移動設備上居中

回答

相關問題