Design comparison
Community feedback
- @bravonoPosted over 1 year ago
Hello, you have done a great job here. But there are a few things you can change.
-
The component to the right doesn't have its own visible box, instead, it's inside a box that holds both the left and the right component in it. If you look at the example, there is no border-radius on the left side of the component to the right. This means that a parent box holds both the left and right components, this box has a border-radius. The left component has a border radius while the right component doesn't.
-
Your shadow is not quite right. Apparently, you cannot apply a box-shadow to the right component since it isn't in a visible box of its own. This means that the box-shadow property has to be applied to the parent box as explained above. The first value of the box-shadow value is the horizontal position, the next value is the vertical position the 3rd value is the softness of the shadow and this is the value I want you to experiment with. Also, remember to use the alpha channel to control the transparency of the shadow. To apply transparency you need to use RGBA OR HSLA for the colors.
I hope that I'm clear and that my feedback helps you improve your code.
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