type="search" is for search, not for the ability to clean the input. Using it for an username, except if it's for search an username, is not a good practice. This could involve side effects in the future. Moreover Firefox Desktop doesn't seem to display the cross.
To OP, you have an error in your HTML : type=“search" the first quotes are invalid, curly quotes instead of straight quotes
With your approach you get full control over the design of the “x”, but it requires JS and you need to use care to make sure it remains accessible.
With <input type=“search” /> you can’t change the look of the “x”, but it will match their OS, which could be desirable! It also won’t require JS to function and should be accessible.
Did you know there is an
<input type=“search” />
for stuff like this? I think it even has decent browser support.Hello,
type="search" is for search, not for the ability to clean the input. Using it for an username, except if it's for search an username, is not a good practice. This could involve side effects in the future. Moreover Firefox Desktop doesn't seem to display the cross.
To OP, you have an error in your HTML : type=“search" the first quotes are invalid, curly quotes instead of straight quotes
I actually first using simple type="text" but kyle suggest me to use type="search"
Good point! I think you’re right.
Yes I know about that but I forgot to use 😅 and i use some of code from my previous post
Well, as with everything... it has trade offs.
With your approach you get full control over the design of the “x”, but it requires JS and you need to use care to make sure it remains accessible.
With
<input type=“search” />
you can’t change the look of the “x”, but it will match their OS, which could be desirable! It also won’t require JS to function and should be accessible.I updated my code 😃