github / markup

Determines which markup library to use to render a content file (e.g. README) on GitHub
MIT License
5.88k stars 3.4k forks source link

markup: <img> tag align="left", align="right" not working since 09-10-24, was fine 09-09-24. align="center" is unaffected (it's ok). #1877

Closed fxkrait closed 2 months ago

fxkrait commented 2 months ago

On any rendered markup file (.md, .org, etc), the align="left" and the align="right" on <img> tags are not working as of today (09-10-24). They were working fine yesterday (09-09-24), and obviously before then as well. align="center" is still working fine, as before (not affected).

An example with a recent wayback-machine cached render (09-04-24):

09-04-24-wayback-doom

Currently, of 09-10-24, it's not rendering correctly:

09-10-24-doom


And here's an older wayback-machine, but more generic example (05-04-24):

If we compare a gist, that showcases how image allignment works, to it's wayback machine cached render from 05-04-24, we can see that align="left" and the align="right" are currently not working:

Discussion thread post: https://github.com/orgs/community/discussions/138339

ClaraCrazy commented 2 months ago

This isnt the only issue with images since today. See my profile readme for example: image

How it is supposed to look like, screenshot from archive.org: image

Lets hope this gets fixed quickly

renfei commented 2 months ago

I also encountered this problem

WechatIMG10

szapp commented 2 months ago

Possibly related: I have also encountered that since today (maybe longer):

1. SVGs are no longer rendered if clickable

This happens with both markdown syntax ![]() or anywhere inside an a tag.

Examples Simple markdown SVG is automatically hyperlinked and **not visible** `![](https://simpleicons.org/icons/github.svg)` > -> ![](https://simpleicons.org/icons/github.svg) <- Explicitly hyperlinked SVG in HTML code is **not visible** `` > -> <- SVG deliberately stripped of hyperlink with `` tag **is visible** `` > -> <- Hyperlinked, ``-tag wrapped SVG is **not visible** again `` > -> <-

2. Hyperlinked images span full width despite being resized to a percentage

This destroys previously inlined images on one line. The culprit seems to be display: inline-block in the .markdown-body a styling rule.
While the image is scaled to the desired width percentage using the <width> tag, the parent a tag remains at the image's full width (see examples below).

Examples Two identical images scaled to 30% width are no longer displayed on one line. ` + ` > -> + <-

⚠️ These issues heavily impact the README of GitHub repositories that often times act as landing pages or documentation. Especially the first issue poses are critical problem because images are just not visible without any indication.

fxkrait commented 2 months ago

Will close this, as the align="left" and align="right" has since been fixed for <img> tags.