Looking for feedback for product landing page

Project Feedback
#1

Tell us what’s happening:
Describe your issue in detail here.
I would like to get feedback on my product landing page. Don’t know how to reduce the space between the products and footer section. Still dragging it out with a media query

Your code so far

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.77 Safari/537.36

Challenge: Build a Product Landing Page

Link to the challenge:

#2

The height of your .main-products div is set to 1600px. You could consider using margins or padding to add space between those sections rather than setting the height absolutely.

#3

ok. Will do that right away. Thanks

#4

done!! looking good now. Thanks a lot!

1 Like
#5

Hi @muubaraq !

I edited your post to remove the codepen link from the title since we can’t on it when it is there.

I think your page looks good.
On smaller devices there is a horizontal scrollbar so you need to keep working on responsiveness.

#6

I appreciate your feedback. Thanks.

#7

Your page looks good @muubaraq. Some things to revisit;

  • Run your HTML code through the W3C validator.
    • 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). (There’s a typo you should clean up)
    • (The one for HTML misses things which is why I recommend W3C)
  • Check that the user has entered a valid email addr. Throw an HTML5 validation error if not.
    • You learned to do this when coding the survey form
  • Make your page responsive. Remember, the R in RWD stands for Responsive
    • There’s a horizontal scrollbar on large and small screens. Elements are too wide for the desktop size and elements do not resize on smaller screens.
1 Like