malte-wessel/react-textfit

Multi mode does not appear to work

kojow7 opened this issue · 3 comments

When I use single mode, the text fits perfectly in a single line. However, when I change the mode to "multi", it no longer seems to resize the text.

Below is an example of my code:


    return(
        <div style={{fontSize: '15px'}}>
            <div style={{margin: '10px', fontFamily: 'Times New Roman', border: 'solid black 2px', width: '200px', height: '80px'}}>
                <Textfit mode="multi">
                    The quick brown fox jumps over the lazy dog.  The quick brown fox jumps over the lazy dog.  The quick brown fox jumps over the lazy dog.
                </Textfit>
            </div>
        </div>
    )

A screenshot of what I am seeing:

image

Is this a problem with the module, or am I doing something wrong?

I'm also having the same exact issue

Try putting the height style directly on the Textfit component. That has worked for me.

<TextFit style={{maxHeight: ...}} /> worked for me!