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

using flexbox

esraagamal 600

@EsraaGamal-22

Desktop design screenshot for the Base Apparel coming soon page coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Rate my design please, Any feedback and suggestions on how I can improve are very welcome!

Community feedback

Shashi Lo 1,345

@shashilo

Posted

Hey Esraa. You did a good job trying this solution. You have a long way to go... the good news is that you can do it! And the path will be great and teach you many things. Here are a few items of improvement I noticed:

  • Paying attention to the detailed of the design. The font style, font weight, line height, etc. These are these to make you a better design implementor.
  • Do not use position: absolute; on the .container. This removes it from the box-model and now your actual height and width of the project is is 0. Look at dev tools in the browser and hover over the <body> tag. You'll see that it has nothing highlighted.
  • Try to build your DOM elements just once. I can see that you have some hidden code for mobile and desktop. When you duplicate your work, it makes it more difficult to maintain.

My suggestion to you is to look at other solutions and see how other people have completed this. There's still more work to be down with your solution before you should move forward to the next challenge.

2

@thevipinmishra

Posted

You did great but I'd recommend focusing on the leadings (line-height) and the placement of submit button right to the input element.

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