title: move the vertical position of an image as a link without moving the link itself
body: <p>I have two links which are using an image as a link. These images strangely are placed a bit higher than excepted, as you can see in this picture:</p>
  
  <p><img src="https://i.stack.imgur.com/ZIkwW.png" alt="enter image description here"></p>
  
  <p>I want to move these images some pixels under so its aligned with the rest of the text. I've used <code>margin-top</code> and <code>padding-top</code> addressing with this path <code>#foot-content a img</code>. But when I moved them they simply move all the rest of the text downwards. Under I place my html of my footer if handy. Could you let me know what solution is there?</p>
  
  <pre><code>&lt;footer&gt;    
              &lt;div id="footer-bg-left"&gt;
                  &lt;div id="foot-content"&gt;
                      &lt;p&gt;Diseñado por &lt;a href="mailto:hola@escuderodesign.com"&gt;Daniel. R-Escudero&lt;/a&gt; &lt;span&gt;|&lt;/span&gt; Todos los derechos reservados &lt;span&gt;|&lt;/span&gt; &lt;a href="mailto:info@rosasusaeta.com"&gt;info@rosasusaeta.com&lt;/a&gt; &lt;span&gt;|&lt;/span&gt;&lt;a href="http://www.linkedin.com/pub/rosa-susaeta/50/1aa/134"&gt;&lt;img src="./_img/footer/logo.linked.png"&gt;&lt;/a&gt; &lt;a href="https://www.facebook.com/rosa.susaetasalichs"&gt;&lt;img src="./_img/footer/logo.facebook.png"&gt;&lt;/a&gt;&lt;/p&gt;
                  &lt;/div&gt;
              &lt;/div&gt;  
  &lt;/footer&gt;
  </code></pre>