malte-wessel/react-textfit

Configuring the output HTML element types?

andyford opened this issue · 0 comments

Is there a way to configure or somehow manipulate the HTML wrapper elements that the plugin generates?

The generated markup is div > span

So if you use:

<Textfit mode="single">
    <h2>Fat headline!</h2>
</Textfit>

...then the output is div > span > h2
this is invalid markup because block elements (like H2) cannot be nested inside of inline elements (like span)

And if you use:

<h2>
    <Textfit mode="single">
        Fat headline!
    </Textfit>
</h2>

...then the output is h2 > div > span
this is invalid markup because block elements (like div) cannot be nested inside of heading elements (like H2)

Is is possible to either:

  • always use span > span instead of div > span in the generated markup
  • or specify the outer element (for example h2 instead of div)

thanks!