Design comparison
Solution retrospective
Hi folks I tried to insert de bakcground-image, but it didn't work. I think there is a problem with my .svg image. Could someone help me with this problem? body { background-image: url(..images/bg-pattern-top-desktop.svg), url(..images/bg-pattern-bottom- desktop.svg); background-position: bottom 50vh right 52vw,top 50vh left 50vw; background-repeat: no-repeat, no-repeat; ... }
Community feedback
- @skyv26Posted almost 3 years ago
Hi! Jociel, As I saw your report and I checked that, you are using adding tag name at multiple places. Where according to rule for HTML syntax and symantic, a id must only be used at once for single page or can't be used more than one in single document. So please avoid duplicacy.
Classes can be used multiple times and multiple places but id can't be.
I hope it might be helpful.
Best Wishes
Marked as helpful0@jsmeyringPosted almost 3 years agoHi Aakash, Thanks for one more tip. I really forgot about this HTML semantics rule.
1 - @Fernando0654Posted almost 3 years ago
To get a good background position I'd suggest using a
div
withwidth
andheight
along with theimg
tag and other properties like position fixed for exampleTo avoid any accessibility issues when adding these tags that I mentioned, don't forget to add the attribute
aria-hidden: true
Something like this:
<div class="img-right"> <img src="path"> <\div>
I hope this can help you, man. I did this on my last upload and worked well
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