# Arbitrary nonproportional image resizing

**URL:** <https://meta.discourse.org/t/arbitrary-nonproportional-image-resizing/348023>\
**Category:** Product Support\
**Created:** [January 20, 2025, 1:43pm UTC](https://meta.discourse.org/t/arbitrary-nonproportional-image-resizing/348023 "2025-01-20T13:43:15Z")\
**Posts on this page:** 1\
**Showing post:** 2

<div class="post-metadata">

**Author:** ![Canapin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/canapin/32/119591_2.png) [@Canapin](https://meta.discourse.org/u/Canapin)\
**Post date:** [January 20, 2025, 3:06pm UTC](https://meta.discourse.org/t/arbitrary-nonproportional-image-resizing/348023/2 "2025-01-20T15:06:03Z")

</div>

When the image is large and you change the dimensions, it’s automatically cropped because of the lightbox CSS.

 ![image](https://global.discourse-cdn.com/meta/original/4X/b/e/6/be6f2ea64830fe0aaec6c192f3b39c38ce5f179c.png)

Even if you resize it:

 ![image](https://global.discourse-cdn.com/meta/original/4X/b/e/6/be6f2ea64830fe0aaec6c192f3b39c38ce5f179c.png)

Small images can be posted with the wanted aspect ratio.

![image](https://global.discourse-cdn.com/meta/original/4X/5/4/d/54db096bad36668b9af9baf2a5f77becdad468b3.png)

![image](https://global.discourse-cdn.com/meta/original/4X/5/4/d/54db096bad36668b9af9baf2a5f77becdad468b3.png)

Maybe there’s a very hacky way to be found, such as using an authorized class for the `<img>` tag, like `avatar`:

`<img width="376" height="50" src="https://meta.discourse.org/secure-uploads/meta/original/4X/b/e/6/be6f2ea64830fe0aaec6c192f3b39c38ce5f179c.png" class="avatar">`

![](https://d3bpeqsaub0i6y.cloudfront.net/user_avatar/meta.discourse.org/connrrr/288/462412_2.png)

But it forces a border-radius.

The original is square and forces a lightbox:

 ![image](https://global.discourse-cdn.com/meta/original/4X/9/8/6/98674a50f9a040b3463800eacf3d2c9403ce4292.png)

If you’re an admin, I’d say the easiest way is to use a custom wrap and define a CSS rule. For example:

```plaintext
[wrap=ratio]
!image|500x300](upload://raEVqkaMNqIXQ9YcsiZuYefukFu.png)
[/wrap]

```

```css
[data-wrap="ratio"] .lightbox-wrapper img {
    object-fit: unset;
}

```

![This is an image of an emoji featuring a laughing face with tears. (Captioned by AI)](https://global.discourse-cdn.com/meta/original/4X/a/8/6/a869af5cedf18d8b1a4a405a23c3634100772407.gif)

I wouldn’t be surprised if there was a way to force the aspect ratio as a user, though, or even an easier way as an admin. Maybe don’t even use a wrap and force `unset` on `object-fit` in a lightbox div, but that might mess up the regular layout. I don’t know.

---

_[View the full topic](https://meta.discourse.org/t/arbitrary-nonproportional-image-resizing/348023)._