This is my second day on freeCodeCamp. I have created an imaginary company, named Lunar Express and create a product landing page for its next mission.
Like my Previous Project a.k.a Survey Form I have used Neumorphism to create a different look.
There are HTML syntax/coding errors you should be aware of and address.
Since copy/paste from codepen you can ignore the first warning and first two errors.
Codepen provides validators for HTML, CSS and JS. Click on the chevron in the upper right of each section and then click on the respective ‘Analyze’ link.
The one for CSS is good. Use it and address the issue(s).
(The one for HTML misses things which is why I recommend W3C)
Make your page responsive. Remember, the R in RWD stands for Responsive
There’s a horizontal scrollbar on large and small screens.
To help you visualize how you have your elements set up you can temporarily add the following line to your universal selector border: solid 1px red;
The best method to ensure that your page is mobile friendly is to use a narrow-first approach when creating your page. At the very beginning of the process, narrow your browser as far as it will go and style the page so it looks good at that narrow width (no horizontal scroll bars). You are not using any CSS break points at this time. You will most likely not need a bunch of fancy layout code (using flexbox or grid) because for the most part you’ll want everything to naturally stack on top of each other in a single column (such as the three bag boxes at the bottom). Your CSS will be rather simple at this point, and that’s OK. This will be your base CSS.
After you have your page looking perfect in this narrow view then you can gradually widen your browser until you feel you have enough horizontal room to move things around for the wider view port. This is when you will set your first CSS break point (place it after the base CSS). Use min-width and em units for the break point. Add any styling changes for the wider layout inside the break point (e.g. adding flexbox/grid to move things around). Repeat this widening/adding break points process as needed.
Your site’s really good. Linking to the survey form was a great idea (was that the 'survey form, aka project 2?) I wish I have money now to book a trip.
Neumorphism 
to create a different look.
