title: How to positioning an image between two div
body: <p>i have to positioning an image between the bottom of two div, one inside another like:</p>
  
  <p><img src="https://i.stack.imgur.com/34c9f.png" alt="example"></p>
  
  <p>The code for this example is:</p>
  
  <pre><code>&lt;div style="background:blue;width:500px;height:150px;overflow:hidden;"&gt;
     &lt;div style="background:red;width:500px;height:100px;margin-top:20px;"&gt;
      //DOES IMAGE GOES HERE?
     &lt;/div&gt;   
  &lt;/div&gt;
  </code></pre>
  
  <p>I know that with position absolute i could positioning the image there.. but i don't like that kind of positioning.. is there another way? Thanks!!!</p>