Making a paragraph fit it's content

I have a
<p>
element, which I'd like to add a max width to, and also have
text-wrap
set to
balance
. However, applying these properties creates extra space on the right side of the element, which I'd like to get rid of. As you can see in the pen below, I've tried adding
width: fit-content
, but it doesn't change anything. What should I do to fix this?

Here's a pen:
https://codepen.io/samalander0/pen/ZEPLjzm
image.png
Was this page helpful?