title: How to style img in print layout html
body: <p>I am new to web development and I am trying to create a function that prints a web page. All works properly but I'm having some difficulties with styling images. I had already styled other things with media queries, hiding unnecessary divs and items but I have some difficulties with images that have inline style <code>width: 100%</code>. </p>
  
  <p>I attach my code below:</p>
  
  <p><strong>Javascript</strong></p>
  
  <pre><code>$('#print-btn-page').click(function(){  
     alert('pagina');
     var url_popup = '&lt;?php echo $page_link?&gt;';
     console.log(url_popup);
     var pagina = window.open(url_popup);
     setTimeout(function () { pagina.print(); }, 500);
     pagina.onfocus = function () { setTimeout(function () { pagina.close(); }, 500); }   
  });
  </code></pre>
  
  <p><strong>CSS print style (at the end of style.css)</strong></p>
  
  <pre><code>/* Print Style */
  @media print {
     a[href]:after {
         content: none !important;
     }
     .icam-top-footer{display:none}
     .icam-bottom-footer{display:none}
     .icam-bottom-footer-mobile{display:none}
     .icam-page-submenu{display:none}
     .icam-main-menu{display:none}
     .icam-menu-sidebar{display:none}
     .icam-logo-print{display: none}
     .icam-page-prodotti-preview{text-align: center; }
     .icam-page-prodotti-preview &gt; img{display: inline-block; margin-right: auto; margin-left: auto; }
     .icam-cta-section{display: none}
     .icam-form-contatti{display:none}
     .icam-case-prod-case-studies-prod{display: none}
     .icam-product-case-studies{display:none}
     .icam-btn-red{display:none}
     img{width: 10%; height: auto}
     h4, h5, a{display:none}
  }
  </code></pre>