@visualdenniss
Posted
Good work there! Final result looks nice overall, especially on desktop size.
I'd suggest avoid giving fixed height or max-heights for elements/containers that contain text elements. It will cause accessibility issue, when user changes their default font-size, text will overflow and break the layout. (e.g. you used height:550 for .container) but also fixed height of 100vh for the body. I'd suggest replacing that with min-height: 100vh instead, so it is never smaller but can expand when needed. Body 100vw is also unnecessary as it is the default.
In tablet layout, there seems to be some issues with columns appear on the left side of the page and there is big space on the right. Instead of giving width: 780px you can give a max-width. Same for the invidual columns like .result
Hope you find this feedback helpful!
Marked as helpful