Login
You're viewing the front-end.social public feed.
  • CSS by T. Afif :verified:css
    Feb 13, 2025, 12:56 PM

    💡 CSS Tip!

    Do you know that One-Time password field? You can create it using only one input and a few lines of CSS.

    The HTML: <input type="text" maxlength="6">

    Code & Demo: css-tip.com/single-digit-input

    As a bonus, you can control the number of characters by adjusting the "maxlength" attribute (thanks to the new attr() function!)

    Image attached toot
    💬 2🔄 12⭐ 18

Replies

  • Josgoleztrol@mastodon.social
    Feb 13, 2025, 4:34 PM

    @css
    Love it! But of course they wanted rounded rectangles with focus color per digit, so I used JQuery after all.
    Haha kidding, it was React!

    Ok, no, but I did make a web component that generates some divs to put behind my input.

    💬 0🔄 0⭐ 0
  • 💬 0🔄 0⭐ 0