title: Combining columns in bootstrap for smaller devices
body: <p>I have 3 divs inside one div horizontally aligned.</p>
  
  <p>|    1     | 2 | 3 | </p>
  
  <p>In smaller devices, I want 3 to move to under 1 and look like this:</p>
  
  <p>| 1 | 2 |</p>
  
  <p>| 3 | 2 |</p>
  
  <p>I can do that creating different layouts maybe, but is there anyway to do in bootstrap using grids? </p>
  
  <p>EDIT</p>
  
  <p>Here is a demonstration of what I want to achieve. In desktop, I want it to look like this:
  <img src="https://i.stack.imgur.com/LBHHt.png" alt="enter image description here"></p>
  
  <p>In Mobile:</p>
  
  <p><img src="https://i.stack.imgur.com/aE5g7.png" alt="enter image description here"></p>