js,css and html

Community feedback

• 

  

  Grace•32,130

  @grace-snow

  Posted about 2 years ago

  You need to be working mobile first really. And not submitting at all if the mobile styling is not done.

  This still needs quite a lot of work. Have you had feedback on earlier challenges?

  Here are some fundamentals to focus your learning on

  • all content should be within landmarks (main, footer etc)
  • don't use large margins to try and create a layout. To center a component on the screen use flex or grid properties along with min-height 100vh
  • instead of setting a % width on a component, use max width only (in rem)
  • always use a modern css reset at the start of the styles. Andy Bell has a good one you can look up and use
  • border radius should never be in %. Use a fixed value for that
  • font size must never ever be in px
  • use small padding values for the button. This could be a good candidate for the em unit
  • you are using a very unusual approach for class names. Consider changing to hyphen-separated strings instead of pascal/camel case
  • alt on images is important content - if the images are meaningful they must have proper descriptions of what they look like
  • consider using the picture element for responsive images
  • this is missing a form and label for the input
  • error message containing elements should be present in the DOM at all times, have a unique ID, and be linked to the input with aria-desciribedby
  • Try to Indent your code consistently so it's easier to read and easier to spot bugs
  • follow me on LinkedIn is not a heading for other content. It's also skipping a heading level but headings must always be in the right order in html. I recommend you move this to a paragraph in the footer (attribution)
  • once you've fixed the html, this needs to be listening for a form submit on the first panel, not a button click

  Good luck

  12

  Marked as helpful