Hello everyone 🤓💻, I'm Yaniv and this is my solution for the challenge #4
built with :
Help Me 😰:
I'm just starting and I broke my head trying to accommodate the backgrounds and I feel that my solution is very rudimentary, I hope someone can help me with that.
Thanks!💖
@DonUggioni
Posted
Hey there,
To be honest, I think, your solution looks really good! You did a good job there, don't worry too much about it. Every project is a learning process and I'm sure that on your next project, some things will become easier and others will just be a new challenge and learning opportunity. Also, this is an incredibly simple project so, really don't worry about it too much =)
Keep it up and happy coding 🤓
Marked as helpful
@brilliant-smart
Posted
I use background-image: url(); for both the background images and the area above the profile image. I use values to position the background image. Look at my css below, I use grid too, you can change the values or use %tage to position them well. Hope it will be helpful, regards!
body { display: grid; grid-auto-flow: row; align-content: center; justify-content: center; height: 100vh; width: 100vw; background-image: url("./images/bg-pattern-top.svg"), url("./images/bg-pattern-bottom.svg"); background-color: var(--Dark-cyan); background-position: -17.5rem -31.25rem, 50rem 23.75rem; background-repeat: no-repeat; font-size: 18px; font-family: 'Kumbh Sans', sans-serif; padding: 0.8rem; }
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
