title: How can I put my div "downloads" always 70px below my image
body: <p>Im trying to put my <code>&lt;div id="downloads"&gt;</code> always 70px below my image, but Im not having sucess doing this.</p>
  
  <p>If my text have a lot of words and has the height of my image, it is working fine.</p>
  
  <p>But when my text is smaller, and dont have the height of my image, it is not working fine, my <code>&lt;div id="downloads"&gt;</code> comes up too much and have 70px in relation to my paragraph. But I want in relation to my image.</p>
  
  <p>Do you know how can I position my <code>&lt;div id="downloads"&gt;</code> in relation to my image, to always have <code>margin-top:70px;</code> of my image?</p>
  
  <p>This is my fiddle with what Im doing and what Im having:
  <a href="http://jsfiddle.net/p95EN/2/" rel="nofollow noreferrer">http://jsfiddle.net/p95EN/2/</a></p>
  
  <p>This is what Im looking for:</p>
  
  <p><img src="https://i.stack.imgur.com/XA9Ln.png" alt="enter image description here"></p>
  
  <p><strong>My html:</strong></p>
  
  <pre><code>    &lt;div class="modal"&gt;
      &lt;h2&gt;title&lt;/h2&gt;
      &lt;span id="date"&gt;date&lt;/span&gt;&lt;br /&gt;
      &lt;img class="img" src="uploads/news/image1.png"/&gt;
      &lt;p&gt;Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer.&lt;/p&gt;
      &lt;div id="downloads"&gt;
          &lt;h3&gt;Downloads:&lt;/h3&gt;
          &lt;ul class="links"&gt;
              &lt;li&gt;&lt;a href=""&gt;Link 1&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href=""&gt;Link2&lt;/a&gt;&lt;/li&gt;
          &lt;/ul&gt;
      &lt;/div&gt;
      &lt;span&gt;Back&lt;/span&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>My css:</strong></p>
  
  <pre><code>.modal
  {   
      text-align:center;
      width:100%;
      margin:0 auto 0 auto;
      background:#fff;
  }
  
  .modal .img 
  {
      width:200px;
      height:220px; 
      float:left;
      margin-right:10px;
      border:3px solid green;
      margin-top:15px;
  }
  
  .modal #date
  {
      width:100%;
      color:#ccc;
      font-size:14px; 
      text-align:center;
      color:#7a7a7a;
  }
  
  
  .modal h2
  {
      width:100%;
      color:green;
      font-size:23px; 
      text-align:center;
  
  }
  
  .modal p
  {
      font-size: 17px;  
      text-align:justify;
      line-height:25px;
      word-spacing:-2px;
      width:100%;
      margin-top:15px;
  }
  
  #downloads
  {
      margin-top:70px;
  }
  
  #downloads h3
  {
      color:#444;
  }
  
  .links 
  {
      list-style-type:none;
      margin:0 auto; 
      display:table;
  }
  
  
  .links li
  {
       text-align : left;
  }
  
  .links li a&gt;i
  {
       color:#444;
  }
  
  
  .links li a 
  {
      text-decoration:none;
      color:#000;
      margin:0 auto; 
      margin-top:10px;
      display:inline-block;
  }
  </code></pre>