All comments

• 

  Roy•195

  @royschrauwenSubmitted over 3 years ago

  Hello everyone! 👋

  I love doing all these challenges and finished another one, it's my ninth one! 🎉

  I have been self-learing HTML and CSS since May 2021 and I want to become a developer, so any constructive criticism is very welcome. 😊

  ❓️ Specific Questions ❓️

  1. I wanted to make this one as responsive as possible. I think I managed to do that, but please give me tips on how to improve or point out things where I did a good job.

  2. I tried to take accessibility into account when making this page. I have no experience with it, so please tell me what I did right and where I can improve.

  Thank you very much for any support you can give me. I love all the small tips and tricks the community gives me. 🙏

  Have a nice day! 🙋‍♂️

  

  PING Coming Soon Page: Did I make it responsive and accessible enough?

  2

  21
  

  Brian Farmer•210

  @brianlfarmerllcPosted over 3 years ago

  I think the responsiveness and accessibility is great. The form is keyboard accessible and the use of a tags lets you tab through all the links in the footer.

  Not sure if you are familiar with it but the lighthouse tool in google chrome dev tools can give you great insight to the accessibility areas that need to be improved on in projects. I use it a lot. Firefox dev tools also have a great accessibility tool. Though i'm still learning how to use it myself.

  Great Job!

  Marked as helpful

  2

  This comment has received 1 replyShow
• 

  Iulian Cenușă•330

  @iulian-cenusaSubmitted over 3 years ago

  I manage to solve the most part of the challenge but I saw a few visual bugs on inputs and also I got sometimes NaN in values of tip amount and total per person. Hope someone could help me fix that. Also I will greatly appreciate your feedback on this.

  

  Tip Calculator App by Iulian Cenușă using CSS Grid and Flexbox

  1

  10
  

  Brian Farmer•210

  @brianlfarmerllcPosted over 3 years ago

  great job!

  The bug I saw on the input was that the input got larger when you clicked on it. Was that what you were referring to? If so you could add this to the bill_container and the nr_people_container to keep the img and the input on the same line.

  display: flex; justify-content: space-between; align-items: center;

  For the nan maybe use a ternary operator in the case that it's a negative number in the input? I didn't look at the code for that but maybe something you could easily fix?

  Marked as helpful

  1

  This comment has received 1 replyShow
• 

  Jean Pierre Bizimana•20

  @jpbizSubmitted over 3 years ago

  • Still have issues with Media Queries.

  

  I used CSS Grid and Flex but mostly Grid with Grid-template-area

  3

  10
  

  Brian Farmer•210

  @brianlfarmerllcPosted over 3 years ago

  Hi there looks really good but I have two suggestions.

  To help with the mobile layout you should look into the built in responsiveness that css grid can provide. I found this article very helpful. https://css-tricks.com/look-ma-no-media-queries-responsive-layouts-using-css-grid/

  and second consider creating a 4 row template on the container where the bottom one would hold your social icons. This would help with getting the icons closer to the bottom of the page.

  Keep up the great work!

  1