different div sizes on browser resize

I have 2 divs that are side by side that make up part of my responsive design

I have each div set at a height of 179 because there was a gap under one of the divs and a suggestion was to give them set heights.

When there isnt enough room the divs stack but then the page content gets pushed down further than id like.

Is there any way to keep the divs at the same size as each other when there is room but the right one to end up being only a certain height say 20px rather than 179px when the browser is resized and there isnt enough room for both divs and they stack?