Forms

Classes

Browser Default Styles

Browsers and operating systems provide some default styles and colors that can improve UI...

#CSS, #Forms
Forms

A design review of web forms.

Login

Checkout

Search

Search box

Search results

Quirks

Form items are inline...

#Forms, #Design

Courses

Styling Forms
How to style forms and various elements.

Project updates

Student registration

Create a registration form for students.

Use profile module to add fields.

What information do I need...

#Users and Roles, #Forms

Resources

Custom Styling Form Inputs With Modern CSS Features
https://css-tricks.com/custom-styling-form-inputs-with-modern-css-features/

Styling input pseudo elements.

#Forms, #CSS
A Sliding Nightmare: Understanding the Range Input
https://css-tricks.com/sliding-nightmare-understanding-range-input/

An extensive guide to browser differences with the range input, and how to style them.

#CSS, #Forms
Form elements must have labels
https://dequeuniversity.com/rules/axe/4.9/label
#Forms
::file-selector-button | MDN
https://developer.mozilla.org/en-US/docs/Web/CSS/::file-selector-button

How to style the button inside file upload files.

#CSS, #Forms
Web forms — Working with user data
https://developer.mozilla.org/en-US/docs/Learn/Forms

MDN guide to web forms.

#Forms
<form>: The Form element
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form

MDN form element documentation.

#HTML, #Forms
Subscribe to Forms