title: responsive 2 column 2 row layout
body: <p>I have been trying to figure out how to create this layout, I have a 2 column layout with the left column having 1 row and the right side having 2. Im trying to get it to adjust fluidly. What im having trouble with is I would like the top of the top image on the right to align with the top of the left image while the bottom of the bottom image stays aligned with the bottom of the left image. Should I use a table?</p>
  
  <p>here is what I have so far.. not very close I really appreciate the help.</p>
  
  <p><a href="http://jsfiddle.net/#&amp;togetherjs=TpsEptHKit" rel="nofollow noreferrer">http://jsfiddle.net/#&amp;togetherjs=TpsEptHKit</a> </p>
  
  <p>here is an image of what I would like to acomplish <img src="https://i.stack.imgur.com/BVif7.png" alt="enter image description here"></p>