Product Landing Page - JUGS milk Product Landing page

I am trying to really take the time to get a full understanding of CSS so I can gain the proper experience of debugging and making mistakes trying to build things that are more complex than necessary just to tick off requirements.

Some solid feedback would be greatly appreciated. I am proud of the result but not afraid to be ripped apart a bit.

In all honesty, I made a ton of changes after initially laying it out to try and get it properly responsive in all areas. This likely resulted in extraneous CSS that could have been streamlined, but I am not quite experienced enough to know exactly what to take out. If someone would advise it would be helpful to my learning experience.

1 Like

Welcome to the forums @emagdnim. Your page looks good. Some things to revisit;

  • Run your HTML code through the W3C validator. Just copy your HTML and paste it into the ‘Validate by Direct Input’ tab.
    • Since you’re pasting from codepen ignore the first few errors. Pay attention to the other errors, especially those in the form section. It’s not behaving the way you intend. Also, why not make your submit button a button? Change the cursor to a pointer when hovering over the submit button
  • On the h2 elements the double shadow makes it difficult to read
  • Visited links cannot be read. Black on the dark red blends in.

I love your “whole cow” joke!