Styling form elements
In the examples in the previous section, the forms do not look very visually appealing by default, but luckily, we can improve the look and feel of our forms using CSS.
In this section, we will look at styling the following:
- Textboxes
- Textareas
- Labels
- Buttons
- Select boxes
- Validation styling
Labels, textboxes, and textareas
The first form elements we will look at styling are the label, textboxes, and textarea elements. These are probably the most common form elements, and it is very straightforward to improve the look and feel of these elements with minimal code.
To style labels, you will typically just adjust the font you use and the size of the text. It is common to have the label element sit either on top of its associated form element or to the left.
For textboxes and textareas, typically, you will be interested in changing the size of these elements. It is common to remove the default border around these elements...
