Using TailwindCSS Forms with Blazor EditForm doesn't remove styling on InputText

Question

When using Tailwind forms, I am expecting my <InputText /> element to be unstyled but it keeps the original styling for the text input.

It works fine if I do something like
<input type="text" name="client_name" id="client_name" class="block w-full sm:text-sm border-gray-300 rounded-md">

How can I take away the built in styling for <InputText /> when using TailwindCSS-forms?

Answer 1

You need to add on a type="text".

So you would want something like this:
<InputText type="text" id="client_name" @bind-Value="client.Name" class="block w-full sm:text-sm border-gray-300 rounded-md"/>

The reason being explained below from the @tailwindcss/forms docs:

Note that for text inputs, you must add the type="text" attribute for these styles to take effect. This is a necessary trade-off to avoid relying on the overly greedy input selector and unintentionally styling elements we don't have solutions for yet, like input[type="range"] for example.