rehype-katex unable to render some symbols when used with starlight

[mglsj]

What version of starlight are you using?

0.30.3

What version of astro are you using?

5.0.2

What package manager are you using?

npm

What operating system are you using?

Windows

What browser are you using?

Firefox

Describe the Bug

I'm trying to use latex syntax in markdown but the sqrt sign (oor any symbol above or below digits) is not working
(I'm using remark-math & rehype-katex)

This is not an issue with vanilla remark-math with unified js
remarkjs/remark-math#106

Link to Minimal Reproducible Example

https://stackblitz.com/edit/github-5igvexku?file=src%2Fcontent%2Fdocs%2Findex.mdx

Participation

• I am willing to submit a pull request for this issue.

[HiDeoo]

Thanks for the report 🙌

This appears to be a duplicate of #2511 and the provided workaround seems to fix the issue by adding the following custom styles:

.katex-html svg {
  height: inherit;
}

After adding this line, the repro renders as expected:

Note that the provided Stackblitz repro had an issue with the Katex CSS integrity check, so I just removed it temporarily to make it work.

As mentioned in this message, as these plugins do not allow passing a custom CSS class wrapping the SVG (which would allow users to pass the not-content class), we currently consider some custom CSS to be a reasonable workaround.