Skip to content

fix: centering in firefox #721

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Merged
gkoberger merged 1 commit into from
Apr 3, 2023
Merged

fix: centering in firefox #721

gkoberger merged 1 commit into from
Apr 3, 2023

Conversation

@macuzi
Copy link
Contributor

@macuzi macuzi commented Mar 13, 2023

PR App Fix CX-151

🧰 Changes

Used the correct value for the align attribute. Chrome for some reason allows images to be centered via [align=center]. But this isn't strictly correct: The Image Embed element | MDN

Firefox only recognizes 'middle' and not 'center'.

🧬 QA & Testing

@macuzi macuzi requested review from a team, thenaomiday and trishaprile and removed request for a team March 13, 2023 21:31
@github-actions
Copy link

github-actions bot commented Mar 13, 2023 •
edited
Loading

A review app has been launched for this PR! Image

🔍 Inspect the app: https://dashboard.heroku.com/apps/markdown-pr-721

🧭 Take it for a spin: https://markdown-pr-721.herokuapp.com/

  • Shut down on Mon Apr 3: Since this PR is closed, its review app has been cleaned up. 🧽

trishaprile
trishaprile approved these changes Mar 15, 2023
View reviewed changes
Copy link
Contributor

@trishaprile trishaprile left a comment

Choose a reason for hiding this comment

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

nice fix!

@gkoberger gkoberger merged commit 6a62281 into next Apr 3, 2023
@gkoberger gkoberger deleted the fix-image-align branch April 3, 2023 14:51
@rafegoldberg
Copy link
Contributor

rafegoldberg commented Apr 13, 2023 •
edited
Loading

@macuzi—You're quite right that "center" isn't technically a valid value for the [align] attribute, but we actually accept it1 within RDMD. The distinction between the two is that…

  • setting [align=middle] will align the image vertically to the center of the line's y axis.2
  • setting [align=center] will force the image to be centered horizontally in it's container.1

These changes could possibly have some strange effects on how users image blocks are rendered, so unfortunately I think we have to revert this PR.

Footnotes

  1. that is, we style on it to force the image to display as a block-level element ↩ ↩2

  2. this assumes the image is displayed as an inline-block, which is the default ↩

@rafegoldberg rafegoldberg mentioned this pull request Apr 13, 2023
Merged
1 task
rafegoldberg added a commit that referenced this pull request Apr 13, 2023
@rafegoldberg
Revert "fix: centering in firefox (#721)"
d798464 
This reverts commit 6a62281.
rafegoldberg added a commit that referenced this pull request Apr 13, 2023
@rafegoldberg
Revert "fix: centering in firefox (#721)" (#737)
776bf7c
rafegoldberg pushed a commit that referenced this pull request Apr 14, 2023
@semantic-release-bot
build(release): 🚀 v6.61.1 🦉
e908832 
## Version 6.61.1

### 🛠 Fixes & Updates

* centering in firefox ([#721](#721)) ([6a62281](6a62281))
* **image:** force SVG dimensions in lightbox ([#734](#734)) ([71fc4e5](71fc4e5))

<!--SKIP CI-->
@rafegoldberg
Copy link
Contributor

rafegoldberg commented Apr 14, 2023

Image

This PR was released!

🚀 Changes included in v6.61.1

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

Reviewers

@thenaomiday thenaomiday Awaiting requested review from thenaomiday

1 more reviewer

@trishaprile trishaprile trishaprile approved these changes

Reviewers whose approvals may not affect merge requirements

Assignees

No one assigned

Labels

released

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

5 participants

@macuzi @rafegoldberg @trishaprile @gkoberger