Skip to main content
CSS is fun and cool and I like it.
Article

Auto-Growing Inputs & Textareas

By default, <input> and <textarea> elements don't change size based on the content they contain. In fact, there isn't any simple HTML or CSS way to make them do that. Kinda funny, as that seems like a reasonable use-case. But of course, there are ways, my friend. There are always ways. … Read article “Auto-Growing Inputs & Textareas”

Article

Custom Styling Form Inputs With Modern CSS Features

It’s entirely possible to build custom checkboxes, radio buttons, and toggle switches these days, while staying semantic and accessible. We don’t even need a single line of JavaScript or extra HTML elements! It’s actually gotten easier lately than it has been in the past. Let’s take a look.… Read article “Custom Styling Form Inputs With Modern CSS Features”

Sponsored Article

Paperform

Buy or build is a classic debate in technology. Building things yourself might feel less expensive because there is no line item on your credit card bill, but has cost in the form of time. Buying things, believe it or not, is usually less expensive when it comes to technology that isn't your core focus. Build your core technology, buy everything else.

That's what I think of with a tool like Paperform. A powerful form builder like Paperform costs … Read article “Paperform”

Article

A Comparison of Static Form Providers

Let’s attempt to coin a term here: "Static Form Provider." You bring your HTML <form></form>, but don’t worry about the back-end processing that makes it work. There are a lot of these services out there!

Static Form Providers do all tasks like validating, storing, sending notifications, and integrating with other APIs. It’s lovely when you can delegate big responsibilities like this. The cost? Typically a monthly or annual subscription, except for a few providers and limited plans. The cost … Read article “A Comparison of Static Form Providers”

Article

Using Netlify Forms and Netlify Functions to Build an Email Sign-Up Widget

Building and maintaining your own website is a great idea. Not only do you own your platform, but you get to experiment with web technologies along the way. Recently, I dug into a concept called serverless functions, starting with my own website. I’d like to share the results and what I learned along the way, so you can get your hands dirty, too!… Read article “Using Netlify Forms and Netlify Functions to Build an Email Sign-Up Widget”

Article

Datalist is for suggesting values without enforcing values

Have you ever had a form that needed to accept a short, arbitrary bit of text? Like a name or whatever. That's exactly what <input type="text"/> is for. There are lots of different input types (and modes!), and picking the right one is a great idea.

But this little story is about something else and applies to any of them.

What if the text needs to be arbitrary (like "What's your favorite color?") so people can type in whatever, … Read article “Datalist is for suggesting values without enforcing values”

Article

Everything You Ever Wanted to Know About inputmode

The inputmode global attribute provides a hint to browsers for devices with onscreen keyboards to help them decide which keyboard to display when a user has selected any input or textarea element.

<input type="text" inputmode="" />
<textarea inputmode="" />

Unlike changing the type of the form, inputmode doesn’t change the way the browser interprets the input — it instructs the browser which keyboard to display.

The inputmode attribute has a long history but has only very recently been adopted … Read article “Everything You Ever Wanted to Know About inputmode”

Link

Under-Engineered Toggles