title: achieving equal height columns in a responsive / flexible layout
body: <p><strong>I'm trying to achieve equal height columns on a 'responsive' website.</strong></p>
  
  <p>That means I'm using <strong>media queries</strong> to provide several layouts for one website depending on the size of the device and window.</p>
  
  <p><strong>I have 2 columns which need to have the same height.</strong> It's easy to achieve when the layout is fixed. I found dozens of scripts that do it and it works well.</p>
  
  <p>However when I resize the browser window, that <strong>generated height doesn't change</strong>. So if the window is smaller, the height of the columns stays the same as before and the contents of the columns overflows. It's ugly.</p>
  
  <p><strong>Is there a way that generated height could change as I resize the window ?</strong></p>
  
  <p>Note : because of what's inside the columns <strong>I cannot use any CSS trick</strong> with backgrounds images etc. <strong>I really REALLY need both columns to truly have the same height at all times.</strong></p>