更改DIV爲了

Question

這裏有我想要的YUI純CSS做較小的寬度屏幕上的圖像：

我的HTML是相當直截了當：

<div class="pure-g"> 
    <div class="pure-u-1 pure-u-sm-1-2"> 

     <div class="pure-g"> 
      <div class="pure-u-1> 
       A 
      </div> 
     </div> 

     <div class="pure-g"> 
      <div class="pure-u-1> 
       B 
      </div> 
     </div> 

     <div class="pure-g"> 
      <div class="pure-u-1> 
       C 
      </div> 
     </div> 

    </div> 
    <div class="pure-u-1 pure-u-sm-1-2"> 

     <div class="pure-g"> 
      <div class="pure-u-1> 
       D 
      </div> 
     </div> 

     <div class="pure-g"> 
      <div class="pure-u-1> 
       E 
      </div> 
     </div> 

     <div class="pure-g"> 
      <div class="pure-u-1> 
       F 
      </div> 
     </div> 

    </div> 
</div> 

有沒有辦法做到這一點只是YUI純CSS或我需要使用JQuery/Javascript？

Answer 1

當然，使A，B和C向左浮動，D，E和F以更大的屏幕寬度向右浮動。但是他們必須從「純粹的純粹的 - 純粹的 - 1-2」的分裂中解脫出來。