Automattic / Automattic/jetpack

Enhancement: Improving Image resulting code in the Markdown parsing library

Open
#45,734 2 comments 0 reactions 0 assignees View on GitHub
[Feature] Markdown [Status] Needs Author Reply Enhancement
Dominant language
PHP
Stars
1.8k
Forks
898
Avg merge
1d 18h
Merged PRs (30d)
774

Description

### Impacted plugin

None / Other

### What

Images doesn't have any width limitations

### How

We have introduced the markdown parsing library in our synced handbooks (as part of the whole integration), and it seems that the resulting HTML for the images, when the images are too big, tend to break the page

Example

Image

Ideally, the markdown parser should add at least a `max-width:100%` and maybe, a `object-fit:contain` to avoid this unnecessary overflows.

Contributor guide

Open the contributing guide

Research direction

Start by locating the Markdown parsing entry point that produces the shown img HTML and inspect how image attributes and styling are assembled. Compare the current output with the reported oversized-image example; done means rendered images no longer overflow their container, using the requested max-width behavior and evaluating object-fit containment.

Written by the indexing model from the issue text.

Assessment

Tech stack
css, php
Domain
content, frontend
Issue type
Feature
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.