@vanzasetia
Posted
Hi, Timic! π
Congratulations on completing your first Frontend Mentor challenge! π
I have some suggestions for this solution.
- Uppercase the text with CSS instead of manually uppercase the text in the HTML. The uppercased word in the HTML will be spelled by the screen reader (spelled letter by letter).
- There's no need to have absolute positioning to position the card to the middle of the page. Instead, I would recommend adding
justify-content: center
; to thebody
element to center the card horizontally. Also, usemin-height
instead ofhieght
. Currently, on mobile landscape view the card is getting cut off on the top. - Adjust the breakpoint of the media query. It's too late to have a two columns layout on 1440px. Currently on my desktop view, 1280px * 800px, the card is so large. Just to let you know that, the sizes on the
style-guide.md
have nothing to do with the media queries. They are telling you that "this is how your website should look like at these screen sizes". As frontend developers, we should keep making your website looks good in between those screen sizes.
That's it! Hope you find this useful! π
Marked as helpful