Cursor jumps to next line sometimes (in this case with headings)

[madshargreave]

When using headings, the cursor is not on the same line

[jch254]

@madshargreave how are you using the component?

I was able to get it working with headings by using something like:

      <Heading size={1} big>
        <Typist avgTypingSpeed={40} startDelay={1000} cursor={{ hideWhenDone: true }}>
            Wassup
        </Typist>
      </Heading>

[jstejada]

hi @madshargreave thanks for reporting this. I have actually been able to reproduce this, only on chrome, and it's driving me nuts. I think I'll have a fix for this soon. Sorry for the late reply!

[jstejada]

Hi @madshargreave , this is actually a different issue from what I thought! The problem is that by default headings are display: block, so you need to change the heading's display to something like inline-block for the cursor to display correctly next to it. Or you could also do @jch254's solution.

Thanks!