I’m trying to create an input field that expands to fit its content using the CSS property width: min-content (or width: fit-content). However, the input box isn’t expanding as expected.

Here’s my code:

<input type="text" style="width: min-content;"> 

Am I missing something? Is there a more reliable way to do this in CSS? Or do I need to resort to JavaScript?

I’m expecting the input box to expand with input value.