title: Responsive divs with and image in each
body: <p>I am trying to done is have a responsive div with 2 pictures centered, one in each div.</p>
  
  <p>What I am want it is to drop down, when the screen is small and not big enought to display them side by side.</p>
  
  <p>At the moment with the below when the screen is smaller it pushes the images into each other.</p>
  
  <pre><code>&lt;style&gt;
  .container{width:100%}
  .inner_container{float:left;width:50%;}
  .img_container{width:250px;margin:0 auto:padding-bottom:5px;}
  &lt;/style&gt;
  
  &lt;div class="container"&gt;
      &lt;div class="inner_container"&gt;
          &lt;div class="img_container"&gt;
              &lt;a href="http://www.google.co.uk"&gt;&lt;img src="left_img.png" width="250" height="70" alt="" border="0"&gt;&lt;/a&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="inner_container"&gt;
          &lt;div class="img_container"&gt;
              &lt;a href="http://www.google.com"&gt;&lt;img src="right_img.png" width="250" height="70" alt="" border="0"&gt;&lt;/a&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>