在YUI Pure CSS中在较小宽度的屏幕上更改div顺序

Question

这是我要在较小宽度的屏幕上使用YUI Pure 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 Pure CSS来执行此操作，还是需要使用JQuery / Javascript？

Answer 1

当然，使A，B和C向左浮动，而D，E和F向右浮动更大的屏幕宽度。 但是它们必须从“ pure-u-1 pure-u-sm-1-2” div中删除。