mdn / yari

The platform code behind MDN Web Docs
Mozilla Public License 2.0
1.19k stars 508 forks source link

fix(layout): add scrolling container around block math elements #11856

Closed pepelsbey closed 1 month ago

pepelsbey commented 1 month ago

Summary

Adds <figure class="table-container"> around <math display="block"> to contain oversized formulas, just like it does for oversized tables. See the same PR to rari.

💡 In this case, $("table, math[display=block]") actually selects both tables and math blocks.

Screenshots

Before

https://github.com/user-attachments/assets/29c63df5-102d-4115-a142-7e9cb1e5aea1

After

https://github.com/user-attachments/assets/164bb081-8a58-4545-a854-aa94b5cc4a2e

Additional details

In the next step, it would make sense to rename it to overflow-container since it’s not exclusive to tables anymore.