WordPress的 - 短碼列移動堆疊順序

Question

這是令人難以置信的簡單，但讓我瘋狂！

我工作的一個WordPress主題，並使用該插件簡碼極限，其立足於引導庫它的造型。我是Bootstrap的初學者，需要在移動/平板設備上重新排列元素（< 770px）。

基本上我希望做的是對上一個版本的桌面屏幕的左側<h2>和<p>和右邊的<img>（他們已經）。

當視口寬度是< 770px我想有<img>頂部的<h2>和<p>。但是，目前的情況是這樣的:(相反

[div] 
    [div] 
     <h2>Our Roots</h2> 
     <p>Some text</p> 
    [/div] 
    [div] 
     <img src="some-image.png"> 
    [/div] 
[/div] 

Answer 1

移動IMG的div更高，使用右拉式將它漂浮到右側的桌面視圖。

Answer 2

您可以使用@media電話和創建您的每一個場合的自定義CSS和使用上拉左，右拉班你第一種情況

Answer 3

感謝大家的響應，還在學習引導我所做的就是這一點，它完美地工作：。

[div] 
    [div] 
     <img src="some-image.png" class="mobile"> 
     <h2>Our Roots</h2> 
     <p>Some text</p> 
    [/div] 
    [div] 
     <img src="some-image.png" class="desktop"> 
    [/div] 
[/div] 

我基本上只是放置在圖像兩次，應用這個CSS：

.mobile { 
    display: none; 
} 

@media screen and (max-width 770px) { 
    .mobile { 
    display: block; 
    } 
    .desktop { 
    display: none; 
    } 
} 

仍在學習:)