title: Float image left, float text right and align at bottom?
body: <p>I basically have three elements on two rows- a logo (image 350px wide by 150px tall)and a text heading in the first row, and then a navigation bar on the next.  What I am trying to do is make the text align with the bottom of the image, while having the image in the far left and the text on the far right.  I was able to get it in the right position by using position: relative &amp; position: absolute, but since I am trying to make the website responsive when it shrinks down the text and logo overlap and it breaks.
  Any help would be greatly appreciated!
  This is what I am trying to make-->>></p>
  
  <pre><code>------------------------------------------------------
  logo x x x
  logo x x x
  logo x x x                                  text here
  ------------------------------------------------------
       navigation bar navigation bar navigation bar
  </code></pre>