Put a DIV over another with CSS only

Put a DIV over another with CSS only

I'm trying to put a div over another with just CSS because will have a PC
and mobile style.
For example i have a container with 3 divs inside (style att just for this
example):
<div>
<div style='float:left;'>div #1</div>
<div style='float:left;'>div #2</div>
<div style='float:right;'>div #3</div>
</div>
will show as
-----------------------
--div #1--div#2--div3--
-----------------------
but in mobile will show as
-----------------------
--div #1---------------
--div #2---------------
---------------div #3--
So i plan to use something different for mobile as:
-----------------------
--div #1-------div #3--
---------div #2--------
with resolutions from 320px to 1024px:
@media only screen
and (min-device-width : 320px)
and (max-device-width : 1024px) {
/* HERE MY CSS */
}
So, Is this possible?. Thanks in advance for your help/suggestions.