Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Newsletter-sign-up-with-success-message-main

EL harabiy 150

@Mubarak-Adeyemi

Desktop design screenshot for the Newsletter sign-up form with success message coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Community feedback

Nikola 190

@porumbachanov

Posted

Hi there, I have a few suggestions that could improve the design.

  1. The form is way too stretched, I would suggest using "rem" instead of percentage for the "max-width".
  2. For the custom list image (the checkmarks), instead of targeting the "ul" with the "::before" pseudo-element, you can directly change the list style of the "ul" by using list-style-image: url(url to image).
  3. There really is no need for using CSS Grid, all of this could be accomplished with Flexbox, it would make the code look way cleaner. You can accomplish this by separating the content (the text, form, button, etc.), and the image into two "container" divs and just display: flex them.

Not sure if the last point made sense, but hope it this helps.

0

Please log in to post a comment

Log in with GitHub
Discord logo

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