I have an image frame that needs to fit variable images without losing their original aspect ratio, currently every image just stretches to fit the frame. Is there a good solution to this problem? thanks in advance
A option is to not apply the CSS property width
but apply the CSS property-and-value pairs max-width: 100%;
and height: auto;
instead, as shown in the example below:
Before:
<img id="dynamic-image" src="images/example.png" style="width: 300px; height: 200px;">
After:
<img id="dynamic-image" src="images/example.png" style="max-width: 100%; height: auto;">