Reports

I got your code working with line-wrapping... a few things to note:

CSS max-width only works if your span has display: block;
Make sure to include the KaTeX CSS
I would recommend using katex.render() instead of katex.renderToString(). It will be safer against XSS attacks - @html can be risky if you do not properly sanitize your inputs, see https://github.com/sveltejs/svelte/issues/7253

<script >
    import katex from 'katex';

    let expr = '1+2+3+4+5+6 = 7';
    let span;
    
    $effect(() => {
        katex.render(expr, span, { displayMode: false });
    });
</script>

<svelte:head>
        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.css" integrity="sha384-zh0CIslj+VczCZtlzBcjt5ppRcsAmDnRem7ESsYwWwg3m/OaJ2l4x7YBZl9Kxxib" crossorigin="anonymous">
</svelte:head>

<span bind:this={span}></span>

<style>
    span {
        display: block;
        max-width: 100px;
    }
</style>

You can see it working in the Svelte Playground here:

https://svelte.dev/playground/98eedf26d75c47bea382dddf448296bf?version=5.25.3

Or similar code with wrapping div:

https://svelte.dev/playground/212f887919404358b4e57936a06df241?version=5.25.3

79538489