Responsive Review Page

Community feedback

• 

  MURRAY122•280

  @MURRAY122Posted over 2 years ago

  Hi Yonas,

  Congrats on the challenge! I had a quick look at the code and have some tips for you.

  • Your container-submit is hidden behind your container. Perhaps using a custom class such as .hide { display: none } would be more suitable? Then once the user has hit submit you could use JavaScript to remove the hide class from container-submit and apply it to your first container. You can learn more on how to add and remove classes with JavaScript.
  • I also noticed that on the mobile view the first container seems too large. You could use media queries to change the style of that class. For example..

  @media screen and (max-width: 375px) {
    .container {
      width: 0;
      height: 0;
    }
  } 
  

  Any classes within that media query will be applied when the users screen is no more than 375px wide. You could also change it to min-width: 375px which means any classes within the media query will apply when the users screen is more than 375px, depending on your preference.

  Marked as helpful

  1