Borut Flis Borut Flis - 14 days ago 9
CSS Question

How to resize image in HTML using percentage as parameters?

I would like to resize an image on my website. I know how to do it by either resizing the image before or calculating the width and height and setting the values in pixels. But I use the same picture multiple times with different dimmensions, so it would take me less time if I could resize the image relatively to its own size.

<img src='images/logo-beta.png' id="logo" height="75%" width="75%"/>


I have tried this, however the problem is that the size is set relative to its parent element.

Answer

There's no way to do what you want automatically using HTML or CSS alone. You'll need to use JavaScript to get the image's dimensions, then calculate a percentage of those dimensions and reapply them to the image in pixels