Mobile First Responsive Profile Card Component
Design comparison
Solution retrospective
The most difficult part of this project is building the background image, everytime it exits from the devtools, the background keep missing, is there any advice about this?
Community feedback
- @MelvinAguilarPosted about 2 years ago
Hi @christian-prasetya ๐, good job on completing this challenge! ๐
In your SCSS file update the path of the images to this:
background-image: url(../images/bg-pattern-top.svg), url(../images/bg-pattern-bottom.svg);
Remember that when you compile styles from SCSS to CSS, the referenced styles file is in another location (/dist/style.css).
Also, remove the background-size and you can use these positions to place it like in the design:
background-position: right 52vw bottom 35vh, left 48vw top 52vh;
Good job, and happy coding!
Marked as helpful1@christian-prasetyaPosted about 2 years ago@MelvinAguilar well thanks mate, let me try the solution.
1
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