自舉div不堆棧

所以我使用bootstrap來實現網格類型佈局。自舉div不堆棧

但是，當應用XS類（移動設備）時，我的兩個div不堆疊。

我的第一個div是設置這樣的：

<div class="col-xs-12 col-md-3 pull-right" id="ad-container"> 
Content 
</div>

我的第二個這樣的：

<main id="content" class="col-xs-12 col-md-9 content-area" role="main"> 
Content 
</main>

，當我在手機大小查看時，<main>元素乾脆直接坐在ontop的的'廣告容器'。

pull-right可能導致這種情況嗎？

謝謝

來源

2016-04-24 dwinnbrown

尋求代碼幫助的問題必須包含在問題本身**中重現它所需的最短代碼**最好在[** Stack Snippet **]中（https://blog.stackoverflow.com/2014/09/）引入可運行的JavaScript-CSS-和HTML的代碼段/）。請參閱[**如何創建一個最小，完整和可驗證的示例**]（http://stackoverflow.com/help/mcve） –

pull-right似乎是問題所在。爲了確保您的內容區配備左側上更大的屏幕，而是堆放在手機使用Column Ordering

<div class="row"> 
    <div class="col-xs-12 col-md-3 col-md-push-9" id="ad-container"> 
    Content 
    </div> 
    <div id="content" class="col-xs-12 col-md-9 col-md-pull-3 content-area" role="main"> 
    Content 
    </div> 
</div>

col-md-push-9 9和col-md-pull-3「推」列於右側的廣告容器下面的「拉動」列在「md」或更大的屏幕上左邊3。

來源

2016-04-24 12:07:21 Ritz

修復它精彩！謝謝 – dwinnbrown

自舉div不堆棧

回答

相關問題