BUG: On page background images don't work because CSS loads with no ; at the end of URL
Question
GrapesJS version
- I confirm to use the latest version of GrapesJS
What browser are you using?
Chrome and Firefox
### Reproducible demo link
https://www.teamfunnels.net/login.php demo demo
### Describe the bug
Missing required ; after .png)
The editor loads this way when there are background images on the page and they don't display.
<style>
#i7u3f{
background-image:url(https://www.teamfunnels.net/assets/202201141203/img/hero-bg.png) background-position:top center;
background-size:cover;
}
#i6o6l{
background-image:url(https://www.teamfunnels.net/assets/202201141203/img/bg-departments.png) background-position:top center;
background-size:contain;
}
#ifttij{
background-image:url(https://www.teamfunnels.net/assets/202201141203/img/bg-eye-care.png) background-position:center;
background-size:contain;
}
#i6k5vw{
background-image:url(https://www.teamfunnels.net/assets/202201141203/img/about-us.png) background-position:top center;
background-size:contain;
}
#i6typr{
background-image:url(https://www.teamfunnels.net/assets/202201141203/img/about-bg.png) background-position:top center;
background-size:contain;
}
#i9qpbl{
background-image:url(https://www.teamfunnels.net/assets/202201141203/img/doctors-us.png) background-position:top center;
background-size:contain;
}
#injrir{
background-image:url(https://www.teamfunnels.net/assets/202201141203/img/doctors-bg.png) background-position:top center;
background-size:contain;
}
#icnre6{
background-image:url(https://www.teamfunnels.net/assets/202201141203/img/people.png) background-position:top center;
background-size:contain;
}
#iywt0f{
background-image:url(https://www.teamfunnels.net/assets/202201141203/img/people-bg-1.png) background-position:center;
background-size:cover;
}
#igpf6a{
background-image:url(https://www.teamfunnels.net/assets/202201141203/img/people.png) background-position:top center;
background-size:contain;
}
#i5w8nh{
background-image:url(https://www.teamfunnels.net/assets/202201141203/img/dot-bg.png) background-position:bottom right;
background-size:auto;
}
#validationTextarea{
height:250px;
}
#ieo7xa{
background-image:url(https://www.teamfunnels.net/assets/202201141203/img/blog-post.png) background-position:top center;
background-size:contain;
}
#is3qsh{
background-image:url(https://www.teamfunnels.net/assets/202201141203/img/dot-bg.png) background-position:top left;
background-size:auto;
}
#irarp9{
background-image:url(https://www.teamfunnels.net/assets/202201141203/img/cta-bg.png) background-position:center right;
margin-top:-8.125rem;
background-size:contain;
}
#i81ozm{
background-image:url(https://www.teamfunnels.net/assets/202201141203/img/dot-bg.png) background-position:top left;
margin-top:-3.125rem;
background-size:auto;
}
</style>
### Code of Conduct
- [X] I agree to follow this project's Code of ConductAnswers (1)
I think I caused this problem with a string replace. Sorry
Related Questions and Answers
Continue research with similar issue discussions.
Issue #4371
BUG: All editors broken after last update that broke storage manager.
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome Reproducible demo link https://www....
Issue #4010
BUG:
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome / Firefox Reproducible demo link ht...
Issue #6685
BUG: Custom component styles are not applied after deletion and re-addition
GrapesJS version [x] I confirm to use the latest version of GrapesJS What browser are you using? Chrome v143.0.7499.193 Reproducible demo l...
Issue #5442
BUG: After applying the text color not able to set the background color
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? chrome Reproducible demo link https://jsfi...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.