How to Style the Easy-to-Style Widgets

The easier widgets to style are <form>, <input> (but not "search"), <label>, <output>, and a few others. By styling these when creating your form, you make the form easier for the user and ensure the data is correct by using form validation in the next section. This has a great example of styling a "postcard" contact form from scratch. Download the starter file and follow along to make your own styled form.

Summary

As you can see, as long as we want to build forms with just text fields and buttons, it's easy to style them using CSS. In the next article, we will see how to handle form widgets which fall into the "bad" and "ugly" categories.