@TDangerWSubmitted 5 months ago
Nicholas Johnson
@njohnson68All comments
- @njohnson68Posted 5 months ago
The only thing that stands out to me to improve would be to make the buttons and the grey box a bit darker, but otherwise this solution looks good to me!
Marked as helpful0 - @jeniegSubmitted 5 months agoWhat are you most proud of, and what would you do differently next time?
Got to use nested CSS which was quite fun to learn. Want to incorporate this more in my own designs.
What challenges did you encounter, and how did you overcome them?Had to google styling of the tags as I couldn't recall from memory
What specific areas of your project would you like help with?Any feedback on code quality and any improvements I could make.
@njohnson68Posted 5 months agoHi Jennifer!
Potential improvements I see are some typos in the gray text blob as well as the lines in that particular blob needing to be spaced a bit farther apart.
Otherwise, well done!
Marked as helpful0 - @MelissaZhuuSubmitted 5 months agoWhat are you most proud of, and what would you do differently next time?
I'm proud of completing my first frontend mentor challenge. Although it was a simple one and I only used HTML and CSS, I learned a lot about CSS positioning and Flexbox and I feel more confident styling HTML elements moving forward. I also recently went back and fixed up my old solution, making it responsive so I'm pretty proud of this new solution. Next time, I would try to practice using a CSS preprocessor like Sass or a framework like Bootstrap or Tailwind.
What challenges did you encounter, and how did you overcome them?I've always struggled with positioning HTML elements. I understood what Flexbox is but haven't actually applied my knowledge much in practice. Originally, I thought I had to combine Flexbox with absolute and relative positioning to position elements exactly how I wanted, however I soon realized that using absolute positioning kind of messed up the behavior of the card once the screen size shrunk. I went over my old solution and was able to find a way to produce the design with only Flexbox. I realized that I had to adjust the way I was thinking about positioning to the way Flexbox worked. I was too fixated about positioning the QR code 16px from the top of the container, which is why I thought absolute positioning made sense. Instead, since things were already centered in flexbox, I just had to adjust the spacing in-between components to push it more to the top of the container.
What specific areas of your project would you like help with?I know it's ideal to not use pixel values in order to make a website responsive. However, is it ok for border-radius to be in pixels or do people usually change that to a responsive unit as well?
@njohnson68Posted 5 months agoHi Melissa!
Your solution seems to be very close to the original design, so well done! Your code is easy to read and straightforward. I would need to learn more about positioning to see if there is a better way to do it than the way you did, but the solution looks good as coded, so I don't have any improvements I would make in that regard. Overall, good job!
0
