Submitted 3 months ago

Responsive Sign Up Form With Validiation Using Js CSS

Ahmed Ali•680

@qayoommunawar

A solution to the Intro component with sign-up form challenge

Preview Code

Solution retrospective

What are you most proud of, and what would you do differently next time?

I am proud of using fluid grid layout, i know it is not that much ideal for this situation for this design, but i enjoyed doing it.

What challenges did you encounter, and how did you overcome them?

Using js for the very first time, so not a good experience. But I did it somehow. I will be looking forward to any suggestion particularly css, because i love it and it also is hard for me, the responsive part is more of a headache for me. looking forward to your suggestion and comments on form's design as it is just seem tricky to me like making it more of responsive.

What specific areas of your project would you like help with?

Mention in above section.

Code

Please log in to post a comment

Community feedback

Marzia Jalili•9,430
@MarziaJalili
Posted 2 months ago
Running like clockwork! 🎉

🌟 Some tiny little tweaks?

✅ A pro tip for centering the form:
```
display: grid;
place-items: center;
```
✅ You could consider using the clamp() function for responsive font sizes, margins and paddings instead of setting different sizes in media queries.
- Here's an example of how it works:
```
/* Syntax of clamp() */
clamp(minimum, preferred, maximum)

/* Example...*/
h1 {
  font-size: clamp(1.5rem, 5vw, 3rem);
}
```
🌟 Overall, the web is lit, man!

😎😎😎

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord