title: 3 divs rearrange div stack on mobile
body: <p><img src="https://i.stack.imgur.com/bYEwN.jpg" alt="enter image description here"></p>
  
  <p>Desktop 
  a - 30%
  b - 30%
  c - 70%</p>
  
  <p>all 100% on mobile </p>
  
  <p>Hi trying to achieve the following layout , taught about inclosing a and b in a container , but that wont work on mobile , i'm sure one of you css junkies , has the answer.
  I am familiar with media queries.</p>
  
  <p>this is what i got so far which is not right</p>
  
  <pre><code>&lt;div id="a"&gt;a&lt;/div&gt;
  &lt;div id="b"&gt;b&lt;/div&gt;
  &lt;div id="c"&gt;c&lt;/div&gt;
  
  #a{
      width : 30%;
      background-color : black;
  }
  #b{
      width : 30%;
      background-color : orange;  
  }
  #c{
      width : 70%;
      background-color : green;
      float : right;
  }
  </code></pre>
  
  <p><a href="http://jsfiddle.net/YcJLL/" rel="nofollow noreferrer">http://jsfiddle.net/YcJLL/</a></p>