Design comparison
SolutionDesign
Solution retrospective
i got a problem with positioning the two images in the background 💔💔
Community feedback
- @imadvvPosted over 2 years ago
Greeting Youcef Boudour!! Congratulations on completing Your challenge!,
one easy way to archive this backgrounds, is to use them as backgrounds on CSS,
a fix example.
index.html line 15
<div class="top"></div> <div class="bottom"></div>
style.css line 15
body { min-height: 100vh; position: relative; z-index: 1; overflow-x: hidden; } .top { position: absolute; top: 0; left: 0; height: 50vh; width: 50vw; background-image: url("../images/bg-pattern-top.svg"); background-position: bottom right; background-repeat: no-repeat; z-index: -1; } .bottom { position: absolute; bottom: 0; right: 0; height: 50vh; width: 50vw; background-image: url("../images/bg-pattern-bottom.svg"); background-position: top left; background-repeat: no-repeat; z-index: -1; }
Hope this give you some Hints!!
but over all, Happy Codding, Have a Good Day/Night
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