/sign-up-form

Sign-Up Form for TheOdinProject

Primary LanguageHTML

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

image

Demo

👉 Live Demo