@brasspetals
Posted
Hi, William Spanfelner! 👋 Congrats on submitting another solution! 🎉
Here's a few suggestions to make it even better:
- A small design nitpick is that the background-color for the body as well as the buttons should be light gray rather than white.
- From 376px - 800px, the card overflows the screen as well as on smaller mobile screens (iPhone SE - 320px). To make your solution fully responsive and accomodate these sizes, you could lower the
min-widthof your cards div for small mobile screens, and adjust your media query for the medium/tablet widths. - Another common mistake (and something I've done myself 😅) is using
buttonelements for what are actually button-styled links. While they look like buttons, they don't have button functionality, so it's better practice to use anchor tags.
Hope these suggestions are helpful, and happy coding!
@Will-1-Am
Posted
Thank you very much for taking the time to look at my code @brasspetals!
The background-colour on the buttons, heading and body background is a very valid point and initially the buttons were setup that way. When I compared the design files to my work, however I decided to change the colour back to white as I couldn't discern the gray colour in the design file. Nevertheless, the gray colour has now been reapplied to the three areas as stated in requirements and as you rightly pointed out.
The overflow issue is also something I planned to give a little love.
Thank you for also highlighting the button elements point - I will put that right also.
@Will-1-Am
Posted
@brasspetals The suggested amendments have been added. Would you be so kind as to cast your gaze over my code and let me know your thoughts?
@brasspetals
Posted
@Will-1-Am It's so great to see the site now fully responsive - and with the button/anchor tag switch now semantically correct! 👍 The color change is subtle, but with everything now the same light gray, it pulls it all together.
I really had to search, and the only thing I could see to improve was to convert a few leftover px values to rem (for example: min and max width values on the .cards media query). Otherwise you're golden! 🙌
@Will-1-Am
Posted
@brasspetals Thank you for your reply and suggestions. The px to rem conversions have now been applied. Thank you again for all of your effort and attention.
