Sign Up Form

A fully responsive sign up form created using HTML and CSS!

Learnings

• Some cool Emmet abbreviations: Remove Tag, Wrap with abbreviation, Evaluate Math Expressions, Go to Matching pair, Tag Balancing

• The accent-color CSS property which sets the accent color for user-interface controls generated by some elements.

• Organizing Form Elements: fieldset and legend

• Button types: submit, reset, generic

• How to Align multiline text fields[eg: textarea] with their labels (use vertical-align:top 😉)

• Difference between <input> type button and the equivalent <button> element

• Imp note: For buttons that are used within a form for different purposes other than submitting the data, the type attribute should always be specified to avoid unwanted effects of submitting a form.

• Input type -> file (for allowing multiple files to be selected, add the multiple attribute)

• More advanced CSS selectors [Finally, understood pseudo classes and pseudo selectors 😂]

• Custom properties aka CSS variables

• CSS functions: calc(), min(), max(), and clamp()

• About white-space property and text-overflow: ellipsis

• @font-face rule

Preview

Demo

👉 Live Demo