Floating Labels with Tailwind CSS

In this video, you'll learn how to pull off that cool "floating labels" effect using just Tailwind CSS utility classes. We'll use a bunch of new features added in Tailwind CSS v2.2, including the new placeholder-shown variants and the `peer` sibling selector variant.

[himanshusrivastava]

Whenever a new video comes from this channel, first I 'like' the video then I watch it. 😁

[rfmiotto]

Again, one more awesome material by Tailwind Labs!
You are a game changer for web developers. I also learned CSS a lot from you.

[igdev]

You guys can add "select-none" and "pointer-events-none" for best experience!

[ApoorvMote]

I have about 20 forms on my site. This is going to dramatically change everything. Thanks Tailwind.

[RyanRampersad]

This is really great. Thanks for making a video on it. The pattern is popular and while I think it looks funny and actually more confusing, I understand why people like it!

[jeffnikelson]

you're a magician man
just found out about tailwind and every day I'm more and more convinced
thank you so much

[flanger]

You entirely changed my mind on this pattern. I hated this when I first saw it because it was always implemented some buggy JS that interfered with password managers. But a pure CSS implementation? Absolute genius. Thank you 💜

[mc-tybr]

Without those screencasts, I'd only know about the basics of tailwindcss. Thank you!

[Laratips]

Mind blowing. Doing this only with css is just amazing.

[swyxTV]

Simon you’re crushing it. Love the demo and the editing and the music!

[sharvinpingulkar]

Thank you! You solved my issue and changed my thought process on how to approach this kind of issue. Keep smashing!

[andreich]

Great stuff! I did this just the other day. Some more of UX improvements: add this classes to labels `pointer-text pointer-events-none`.

[MrSonicastra]

Cool Simon, i was looking today for that on Youtube! I'm glad i found it 😁. Lifesaver, thumps up.

[isaaccloos]

Yooo, that shot at the end was great 👍🏻

[alfredomontoya]

Excellent work and explanation, thank you very much for everything.

[cristianpallares]

Nice! Thanks for the video. Learned something new

[daretobedangerous]

your tutorials are amazing! cheers mate

[telegramvideos]

I'm commited to learn new tailwind trick every day, this is the trick for today.. Thanks !

[MOGE_]

I thought i knew tailwind before watching this video. I could literally feel my proverbial tailwind skill bar go up as I watched this.

[jimmyj.]

Holy crap this awesome tip 😍 thanks a lot 😀😀 accessibility power 💪