# gpui: Fix \`img\` aspect ratio overriding existing value \(\#62367\) · gitcafe/zed

[View on GitCafe](https://git.cafe/gitcafe/zed/commit/59b2ebf10351b5c0b5cd4403f01ed0460eeec06d)

Repository: [gitcafe/zed](https://git.cafe/gitcafe/zed)

Visibility: public

Requested revision: 59b2ebf10351b5c0b5cd4403f01ed0460eeec06d

Requested commit: 59b2ebf10351b5c0b5cd4403f01ed0460eeec06d

Commit: 59b2ebf10351b5c0b5cd4403f01ed0460eeec06d

Tree: e648ca6b8013448f4f9e3c6e4a66b5a9548b7472

Author: Zak Nesler

Committer: GitHub

## Message

```
gpui: Fix `img` aspect ratio overriding existing value (#62367)

# Objective

The `gpui::img` element always overrides the `aspect_ratio` field, so if
you have an image element that applies its own `.aspect_ratio()` it just
gets wiped out.

## Solution

Only apply the aspect ratio default if one is not already set.

## Testing

It's a very minor change but I did add a small test to ensure it
actually gets overridden.

## Self-Review Checklist:

- [x] I've reviewed my own diff for quality, security, and reliability
- [x] Unsafe blocks (if any) have justifying comments
- [x] The content adheres to Zed's UI standards
([UX/UI](https://github.com/zed-industries/zed/blob/main/CONTRIBUTING.md#uiux-checklist)
and
[icon](https://github.com/zed-industries/zed/blob/main/crates/icons/README.md)
guidelines)
- [x] Tests cover the new/changed behavior
- [x] Performance impact has been considered and is acceptable

## Showcase

This came from an issue where vertical images inside an element (square
in this case, as you'd see in an image gallery) do not behave correctly
with `object_fit` values of `ObjectFit::Contain` or
`ObjectFit::ScaleDown`.

This was simply because despite the image element having a fixed square
size (`img().size(px(200.))`), the aspect ratio would be forced to the
ratio of the image itself, so vertical images weren't being properly
fitted into their containers.

Minimal repro for that issue:
https://github.com/zaknesler/gpui-object-fit

So with this change, you can set `.aspect_square()` and the object fit
will behave as you'd expect:

<img width="1237" height="986" alt="image"
src="https://github.com/user-attachments/assets/5b1045a8-bd71-4b77-8bbd-c3b12112bcb0"
/>

---

Release Notes:

- gpui: Fix image element's aspect ratio overriding existing value
```

## Parents

- [08827f9208b4848d62f3faf86ffa15155966d63c](https://git.cafe/gitcafe/zed/commit/08827f9208b4848d62f3faf86ffa15155966d63c?format=markdown)

[Source at this commit](https://git.cafe/gitcafe/zed/tree/59b2ebf10351b5c0b5cd4403f01ed0460eeec06d?format=markdown)