Design comparison
Solution retrospective
Hello community, this is my contribution to this challenge. As for the coding part, I want to orient it to POO, since it is easier for me. I hope for some feedback to improve and thanks , happy coding.
Community feedback
- @Tryt4nPosted over 1 year ago
Because you declaring width and height as a percentage, when the content is bigger then it's overlapping or when the screen size is narrow and tall it's just look not nice. You should avoid declaring width and height based on percentages values to avoid those kinds of situations. They are very problematic in terms of responsiveness. Just declare a constant value or use
min-width
,max-width
, ormin
max
values.Your email validation checking only for gmail, hotmail and yahoo mails. Instead of doing some things with regex on your own there are easier way to do this. Just google out regex for email or use library like email-validator.
You can also consider using a
<dialog>
element for your confirmation element. It's way better and way more accessible.Tip: In your case if you want to center element in the page the easiest way is to use
dispaly: grid
andplace-content: center
orplace-items: center
on your container element so in this case on<main>
element. It's easier than declaringtop
andleft
with some values and then doing the math.0
Please log in to post a comment
Log in with GitHubJoin 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