title: How to resize an image between <a></a> (link image)?
body: <p><strong>CODE:</strong></p>
  
  <pre><code>&lt;div class="marquee"&gt;
     &lt;ul&gt;
        &lt;li&gt;
         &lt;a href="https://developer.apple.com/swift/"&gt;&lt;img class="marquee-itm" src="Vendors/Images/Apple_Swift_Logo.png" /&gt;&lt;/a&gt;
  </code></pre>
  
  <hr>
  
  <p><strong>SITUTATION:</strong></p>
  
  <p>When I remove the <code>&lt;a&gt;</code> tags, this works:</p>
  
  <pre><code>.marquee ul li img {
      max-height: 80%;
  }
  </code></pre>
  
  <hr>
  
  <p><strong>PROBLEM:</strong></p>
  
  <p>When I add the <code>&lt;a&gt;</code>, I can't find a way to style my images.</p>
  
  <p>1) Doesn't work.</p>
  
  <pre><code>.marquee ul li a img {
      max-height: 80%;
  }
  </code></pre>
  
  <p>2) Doesn't work.</p>
  
  <pre><code>.marquee ul li a {
      max-height: 80%;
  }
  </code></pre>
  
  <p>3) Doesn't work.</p>
  
  <pre><code>.marquee-items {
      max-height: 80%;
  }
  </code></pre>
  
  <p><strong>QUESTION:</strong></p>
  
  <hr>
  
  <p>How can I make it work with <code>&lt;a&gt;</code> tags to keep my image links ?</p>
  
  <hr>
  
  <p><strong>EDIT:</strong></p>
  
  <p>Just want to make sure there is no misunderstanding. I am using a carousel which has a width already defined. The carousel has many images in it. I just need to define the max-height for the images so they don't overflow. I just can't seem to select them after I made them clickable images by adding <code>&lt;a&gt;&lt;/a&gt;</code> tags.</p>
  
  <p>Also:</p>
  
  <p>4) Does not work.</p>
  
  <pre><code>.marquee ul li a{
      display: inline-block; 
      max-height: 80%;
  }
  
  .marquee ul li a img {
      max-height: 100%;
  }
  </code></pre>
  
  <p>5) Does not work.</p>
  
  <pre><code>.marquee ul li a{
      display: inline-block; 
      max-height: 80%;
  }
  
  .marquee ul li a img {
      height: 100%;
  }
  </code></pre>
  
  <hr>
  
  <p><strong>SOLUTION:</strong></p>
  
  <pre><code>.marquee ul li a{
      display: inline-block; 
      height: 80%;
  }
  
  .marquee ul li a img {
      max-height: 100%;
  }
  </code></pre>