Design comparison
Solution retrospective
I didn't know how to make the white box
Community feedback
- @talentlessDeveloperPosted about 2 years ago
Hi,
Nicely done project!
As for the white box, you can begin with adding these properties to your alert_info class.
.alert_info { position: relative; background: #fff; border-bottom-right-radius: 0; }
Then you can create a new div inside or use the ::before pseudo element let's say you created a new div inside .alert__info, add these properties to the div.
position: absolute; width: 0; height: 0; border-top: 22px solid #fff; border-left: 22px solid transparent; right: 0px; bottom: -14px
You can adjust the values to fit your preference.
if you want to learn how to create shapes using css, here is a link Css shapes.
Marked as helpful0
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