Responsive desktop/Mobile site using HTML/CSS/JS

Community feedback

• 

  T

  Matt Studdert•13,611

  @mattstuddertPosted over 4 years ago

  Nice work on this challenge, Alan!

  Just a quick heads up, the vh units are what's throwing off the solution screenshot at the moment. As a rule, I would recommend only using vh units in very rare and very specific instances. This is because you're sizing the element based on the viewport instead of the height of the content inside, which can lead to unintended UI issues. As an example, if you look at your preview, keep the width of the browser at full-width but start reducing the height you'll see that some of the content disappears because the section isn't tall enough. Instead, don't set an explicit height on the parent and then just use padding and margin to space out the content within it. This way the height of the parent will be flexible based on the height of the content.

  Here are some pointers with regard to your issues:

  1. You can embed SVG code in the HTML. Then you can treat it like a regular element. So you can change things like the fill color.
  2. If you use background-size: 100%; you'll see it shrinks slightly as the screen gets smaller.
  3. I'm not 100% sure what you mean here. Looks fine to me!

  Don't forget to use alt attributes in your img tags to make them accessible to screen reader users.

  Let me know if you have any questions. Keep up the good work!

  1

  ---

  

  P

  Alan Heffernan•215

  @alanjheffernanPosted over 4 years ago

  Hi Matt,

  If I'm not wrong you are the creator of this wonderful website so it has definitely made my day knowing you took the time to look at my solution and give such detailed feedback.

  As a back end developer self-teaching myself the front-end languages the this is the type of feedback I get when I commit my code for review to the senior developers. Little things like knowing to only to use VH units as best practice are much harder to pick up as I don't have the same feedback loop as I do in work. This feedback is invaluable!

  Looking forward to the launch of the subscription model and to see how this community grows over time!

  Thanks again! I will be sure to keep your comments in mind for future challenges!

  1

  

  T

  Matt Studdert•13,611

  @mattstuddertPosted over 4 years ago

  @alanjheffernan I am indeed! 🙂

  I'm happy my feedback helped. Yeah, I'm excited to launch the subscriptions. There will be loads of great features that it will enable us to add in the future as well.

  Hopefully, the community will continue to grow and help developers improve their skills!

  0