Skip to content

SD-2468 - fix: image not being contained within cell#2775

Open
chittolinag wants to merge 2 commits intomainfrom
gabriel/sd-2468-bug-image-within-cells-not-resizing-still
Open

SD-2468 - fix: image not being contained within cell#2775
chittolinag wants to merge 2 commits intomainfrom
gabriel/sd-2468-bug-image-within-cells-not-resizing-still

Conversation

@chittolinag
Copy link
Copy Markdown
Contributor

@chittolinag chittolinag commented Apr 10, 2026

Issue

When images are inserted into a table cell, depending on the image size, it is overflowing the cell size.

Proposed solution

For inline images, set a maxWidth so it's scaled down (keeping the aspect ratio) when the original size would overflow the parent's size.

@linear
Copy link
Copy Markdown

linear bot commented Apr 10, 2026

@chittolinag chittolinag marked this pull request as ready for review April 10, 2026 18:16
// Position and z-index on the image only (not the line) so resize overlay can stack above.
img.style.position = 'relative';
img.style.zIndex = '1';
img.style.maxWidth = '100%';
Copy link
Copy Markdown
Contributor Author

@chittolinag chittolinag Apr 10, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Any thoughts on something that could break by changing this here? To me, this seems like the right approach because maxWidth simply tells the browser to not overflow the maximum allowed width, but it will still try to render the original size of the image. If the parent's size is smaller than the original image size, the image will be contained within.

Copy link
Copy Markdown

@chatgpt-codex-connector chatgpt-codex-connector bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: fcd6053597

ℹ️ About Codex in GitHub

Codex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".

// Position and z-index on the image only (not the line) so resize overlay can stack above.
img.style.position = 'relative';
img.style.zIndex = '1';
img.style.maxWidth = '100%';
Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

P1 Badge Preserve aspect ratio when constraining inline image width

renderImageRun sets both img.width and img.height earlier, so this new maxWidth constraint can shrink only the rendered width in narrow containers while the fixed height remains, which visibly distorts inline images and can still blow out row height in tables. To avoid introducing that regression, the width cap should be paired with auto-height behavior when responsive shrinking occurs.

Useful? React with 👍 / 👎.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants