Design comparison
Solution retrospective
Good day, friends!
This is my solution for `chat-app-css-illustration-master
- It was so interested to use flexbox, Check the code to see it, I also may have some issue with elements sizing! Something makes them bigger than they should be! *Waiting for your comments
Feel free to leave any feedback and help me to improve my solution (or) make the code clean! Have a Great Day <3!
Community feedback
- @visualdennissPosted over 1 year ago
Hi there,
great job! Must have been a quite a work with CSS to complete. Few suggestions:
-
Try not to use height: 100vh, using fixed height will cause data loss or overflow issues, as i experience now when i view your app on my notebook. Instead try to use min-height: 100vh, this way you don't constrain the content.
-
The paragraph on the right side seems to be a bit too bright, harder to reduce, I'd suggest increasing its value to a darker value so it has a nice contrast with the bright bg and improve readability & UX.
-
Bg decoration on right sight seems to be missing. But that's easy for you to add, since you already added the left one.
Hope you find this feedback helpful!
0@HelalAboodPosted over 1 year ago@visualdenniss It was helpful, Thank you! May I ask, I tried to get the <div class="left">(Phone's div) more smaller with its elements but i doesn't worked at all, How can I resize it so it could be more closer to the main design ?
1@visualdennissPosted over 1 year ago@HelalAbood When the container height is determined by the height of its content, only way is to reduce their size, in this case, it might that the font-sizes are different/bigger than the design.
Np, happy to be helpful!
0@HelalAboodPosted over 1 year ago@visualdenniss Oh I see now, I felt it too! Thx for helping <3
1 -
Please log in to post a comment
Log in with GitHub
Join 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