Feedback: Product Landin Page

I started #100DaysOfCode challenge and finished all lesson from responsive web design: now, I’m building the finals projects to complete the course.
Here is my Third project: Landind Page.

I had some troubles in media query with The Nav Bar: I couldn’t Stick it into the left side. But I think is a good practice for me.

I would love your feed back.

See the Pen Fork Me! FCC: Test Suite Template by leonardootc (@leonardootc) on CodePen.

There is some serious responsive issues here.

It looks very wack at nearly every stage when I adjust my windows.

You might have to go back to the responsive part of web design lessons. I think you mainly need to use % instead of px.

I can see that it will look nice once you do that.

Good luck. Hope to see ur stuff imporved.

:sweat_smile:Yes : I found a solution: It was apply a code javascript but i couldn’t reach the goal to fix it.

:thinking: Okay : I didn’t think in that. I’ll apply % into all page. Thanks!!

Hi @leonardootc, it looks okay, some things you should revisit;

  • Codepen provides validators for HTML, CSS and JS. Click on the down arrow in the upper right of each section and then click on the respective ‘Analyze’ link.
    • The HTML one isn’t that good which is why I tell people to use the W3C validator.
    • The CSS one is good and you should really use it. You have a lot of misspellings that affect how your page will look and in one part you have an attribute named twice in the same line which just breaks it.
  • I don’t expect to see so much white space on a product landing page. If you surfed the web I don’t think you’ve ever seen one either.
  • You need to make the page responsive.
  • Don’t be afraid to be descriptive with id names. It’ll be more semantic for yourself, and others who read your code. For example, if you have several two letter id's that make sense to you now, they may not a year later and probably will never mean anything to other people.