Design comparison
Solution retrospective
Hey everyone! So far so good.This time I'v try to recreate Chat App.Project was a bit challenge for me , I was unable to shape background properly so I decide to leave it as it is :D, hopy you will help me figure it out. In future I will add some more functionality such as live chat , better animiation etc.Right now just know html and css and still learning more about it. If you like it live a comment below!! Cheers!!!
Community feedback
- @pikapikamartPosted over 3 years ago
Hey, great work on the illustration, looks very good indeed.
For you query, I can help with that. Well it is kinda simple, all you need to add is
border-radius
.On your first background, the purple one, you can declare something like
border-radius: 0 0 12rem 12rem;
As you can see right, there are 4 arguments. The top-left, top-right, bottom-left and bottom-right. We only declare 12rem in the bottom-left and bottom-right because that is what we only need.But if you want to experiment with border-radius, that is good, also you can use 8 arguments on border-radius. Something like
border-radius: 50% 40% 30% 60% / 70% 40% 50% 40%
The first 4 arguments goes along the corneres horizontal axis, and the second 4 arguments goes along the vertical axis. Well that is just an extra hahahabut still, you did a good in here^^
0@mziarnkoPosted over 3 years ago@pikamart thank you mate , will check it after back home and do some changes. Cheers
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