Skip to content
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

align mpadded with core #519

Merged
merged 2 commits into from
Nov 19, 2024
Merged

align mpadded with core #519

merged 2 commits into from
Nov 19, 2024

Conversation

davidcarlisle
Copy link
Collaborator

This PR addresses issue #103 where the WG resolved to make mathML4 match mathml-core syntax

A rendered version may be seen at

https://davidcarlisle.github.io/mathml/#presm_mpaddedatt

or for the change log at

https://davidcarlisle.github.io/mathml/#chg_presm

Basically this drops the relative lengths such as +3em as you can use calc(100%+3em) in standard CSS length syntax and it drops 0.5 height as you can use 50% in the most common case of using the existing value while setting the same dimension. You can no longer reference the original height while setting a new width, but this is not a common use case.

@davidcarlisle
Copy link
Collaborator Author

Not done in this PR is to adjust the schema, moving the mpadded-length syntax to the legacy schema. If the schema at mathml-schema is updated appendix A here will automatically update.

@NSoiffer
Copy link
Contributor

It looks pretty good but the last example is bascially a repeat of the previous "calc" example. Can you make the example of what depth= height changes into?

@davidcarlisle
Copy link
Collaborator Author

@NSoiffer

It looks pretty good but the last example is bascially a repeat of the previous "calc" example. Can you make the example of what depth= height changes into?

er yes I will look later I didn't change the examples at all other than just remove the syntax that this PR is removing and replace with calc. In particular the fancy boxed images, but perhaps now the syntax is simpler with less custom variants we can lose one of the examples, or show it differently.

@davidcarlisle
Copy link
Collaborator Author

@NSoiffer oh sorry I misread your comment
@NSoiffer

Can you make the example of what depth= height changes into?

I think that changes in to nothing, I don't think that is supported. Something had to give. You can replace a pseudo-unit that refers to the current dimension by a percentage, but I don't think there is a way to refer to one of the other dimensions

@davidcarlisle
Copy link
Collaborator Author

I wrote

I don't think that is supported.

You can of course use JavaScript, but it turns out that CSS does support referencing the width when setting height in one specific case, percentage values for padding are based on the width. As this is padding you need to hide the natural height if you want to set the height explicitly.

This more or less works in Chrome/Edge to get a squarish box with height set to the width (I only approximated hiding the natural height here by subtracting 1ex.)

<!DOCTYPE html>
<html>
  <head>
   <style>
    .square {padding-top:calc(100% - 1ex)}
    .box {border: solid thin black}
   </style>
  </head>
  <body>
   <math>
    <mi>x</mi>
    <mo>+</mo>
      <menclose class="box" notation="box">
	<mi class="square">abc</mi>
      </menclose>
    <mo>+</mo>
      <menclose class="box" notation="box">
	<mi class="square">abcdef</mi>
      </menclose>
    </math>
  </body>
</html>

image

The syntax here is of course weird but it does indicate that setting the height based on width isn't totally alien to the CSS model and perhaps CSS can have a more natural syntax for this at some point.

@NSoiffer
Copy link
Contributor

Do you want to add that as an example or do you think it is too big/complicated?

@davidcarlisle
Copy link
Collaborator Author

@NSoiffer

Do you want to add that as an example or do you think it is too big/complicated?

No, it's too much of a hack (and pads by twice as much in firefox as chrome), and while it's easy to add top or bottom padding specifying the total height this way needs tricks with absolute positioning that takes the content out of the flow and put it back, and more than likely to conflict with math layout somewhere.

I mention it though as it shows that the basic principle of accessing the original width while setting the height isn't totally alien to css. Also while it's not something I think we could put in the spec it may possibly be useful in some kind of polyfill especially if that's needed in a non-javascript context where you only have css.

@NSoiffer
Copy link
Contributor

Ok. I'll merge it.

@NSoiffer NSoiffer merged commit 5395b72 into w3c:main Nov 19, 2024
2 of 3 checks passed
github-actions bot added a commit that referenced this pull request Nov 19, 2024
@NSoiffer @github-actions
Merge pull request #519 from davidcarlisle/main
5fea666 
SHA: 5395b72
Reason: push, by NSoiffer

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
@davidcarlisle
Copy link
Collaborator Author

I'll bring the schemas in to line...

github-actions bot added a commit to dginev/mathml that referenced this pull request Nov 19, 2024
@NSoiffer @github-actions
Merge pull request w3c#519 from davidcarlisle/main
4deba7b 
SHA: 5395b72
Reason: push, by dginev

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@NSoiffer NSoiffer Awaiting requested review from NSoiffer

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
2 participants
@davidcarlisle @NSoiffer