Design comparison
Solution retrospective
Any feedback is highly appreciated!
Community feedback
- @ApplePieGiraffePosted almost 4 years ago
Hey, Rafet! π The design preview for your solution looks great, but when I click on the live preview of your site, the stylesheet doesn't load for some reason. π€¨ You might want to look into that! π
0@rafetbasturkPosted almost 4 years ago@ApplePieGiraffe
Hello! π
While fixing accessibility issue for button, I uploaded wrong
index.html
file. Thanks for reminding. Waiting for your comment after looking into site preview.Happy coding!
0@ApplePieGiraffePosted almost 4 years ago@rafetbasturk
Yup! There it is! π
I think you've done a pretty good job on this challenge! π Your CSS illustration looks great! π
I only suggest adding overflow-x: hidden to the body to prevent a horizontal scroll bar from appearing along the bottom of the screen on the desktop and mobile layouts. Also, the text of the messages in the phone is a little small, making it hard to readβmaking it a little bigger would be nice! π
Of course, keep coding (and happy coding, too)! π
1@rafetbasturkPosted almost 4 years ago@ApplePieGiraffe
Hello! π
Thanks for your feedback. I added
overflow-x: hidden
to the body.I have a question about background divs I used with
position: absolute
. In the larger screens over 1440px, they exceed the body width. What should be done to prevent exceeding the body width?Happy coding! π
1@ApplePieGiraffePosted almost 4 years ago@rafetbasturk
Hey, rafet! I think that as long as you add
overflow-x: hidden
to thebody
to prevent any horizontal scroll bars, there's nothing wrong with the background shapes exceeding the width of the body (since that is the way they are in the original design). If you'd like, you can try experimenting with positioning the shapes using viewport units so that they more or less remain in their place when the page is resized. π Good luck and have fun! π0
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord